html 第一课

照着老师的写了下
<html>
<head>
	<meta charset="utf-8">
	<title>第一课</title>
	<style type="text/css">

div { width : 350px;
	  height: 280px ;
	padding: 15px
	border-radius:15px;
	box-shadow: 5px 5px 5px #888;
		/*background-color: #efefef;*/
		background-image: url(images/8.jpg);
		background-size: 380px 310px;
		background-repeat: no-repeat;


}


.text{ color:#680000;
	   text-align: center;
	   text-indent: 2em;
		line-height: 1.5em;
}

.test{ color:#680000;
	   text-align: center;
	   text-indent: 2em;
		line-height: 1.5em;
}

.study {
	color:#680000;
	   text-align: center;
	   text-indent: 2em;
		line-height: 1.5em;
}

.love{
	color:#FF00CC;

	   text-align: center;
	   text-indent: 2em;
		line-height: 1.5em;
}

.znd{
	color:#FF0000;
	   text-align: center;
	   text-indent: 2em;
		line-height: 1.5em;

	
}

</style>
</head>
<div>
<h2 style="color:blue;text-align: center;font-size:20px" onmouseover="a(this)"
onmouseout="b(this)" >小句</h2>
<p class="text">一个不努力的人，别人想拉你一把，都找不到你的手在哪里。</p>
<p class = "test">在乎越少，你越开心。</p>
<p class ="study">到了一定的年纪，有了太多的心事，人就会变的寡言。</p>
<p class = "love">我很爱我老婆，很爱她</p>
<p  class = "znd" onmouseover="e(this)"
onmouseout="f(this)">多感谢你伴我身侧一路同行共我喜悲</p>




	</div>
	<body>
<script type="text/javascript">
	function a(element) {
		element.style.fontSize = '24px'
		element.style.color = 'green'
	}
	function b(element) {
		element.style.fontSize = '20px'
		element.style.color = 'brown'
	}

function e(element) {
		element.style.fontSize = '15px'
		element.style.color = 'FF00CC'
	}
	function f(element) {
		element.style.fontSize = '10px'
		element.style.color = '#FF0000'
	}





</script>



	</body>

</html>
相关文章
