web前端开发技术实验与实践（第三版）储久良编著 项目11

实训三 项目11

一、页面文字素材：

明月几时有？把酒问青天。

不知天上宫阙，今夕是何年。

我欲乘风归去，又恐琼楼玉宇，高处不胜寒，起舞弄清影，何似在人间。

转朱阁，抵绮户，照无眠。

不应有恨，何事偏向别时圆。   

人有悲欢离合，月有阴晴圆缺，此事古难全。

但愿人长久，千里共婵娟。

二、代码：

<!--prj_3_2.html-->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			body{
				text-align: center;
				background: url(../img/图片/y11.jpg);
			}
			ul{
				list-style-type: none;
				align-content: center;
			}
			li{
				float: left;
				margin: 12px;
				align-content: center;
			}
			div{
				height: 250px;
				background-color: #99cc00;
				text-align: center;
			}
			marquee{
				font-size: 16px;
				padding: 4px auto;
			}
		</style>
	</head>
	<body>
		<h2>拥抱</h2>
		<h4>弹壳</h4>
		<hr>
		<font size="+2">
			只想让你在我的怀抱<br />
			想给你打造只属于你的迪士尼<br />
			让所有美好和幸运全都围着你<br />
			要我为你付出一切都愿意<br />
			我的世界因为你变得美丽<br />
			只想要保护你一直牵着你的手<br />
			遇到暴风雨我会挡在你前头<br />
			I wish u blessing everyday<br />
			I wish u luck with everything<br />
		</font>
		<hr>
		<div>
			<ul type="">
				<li type=""><embed src="../img/图片/y21.jpg" loop="true" autostart="true" width="280px" height="200px"></embed></li>
				<li><embed src="../img/音频/弹壳拥抱.mp3" loop="true" width="280px" height="200px"></embed></li>
				<li><embed src="../img/音频/爱我的话.mp3" loop="true" width="280px" height="200px"></embed></li>
				<li><embed src="../img/图片/t41.jpg" loop="true" width="280px" height="200px"></embed></li>
				<li><embed src="../img/图片/t51.jpg" loop="true" width="280px" height="200px"></embed></li>
				<li><embed src="../img/图片/t71.jpg" loop="true" width="280px" height="200px"></embed></li>
			</ul>
		</div>
		<marquee direction="left" behavior="alternate" onmouseover="this.stop()" onmouseout="this.start()" bgcolor="#99CC00">只想让你在我的怀抱</marquee>
	</body>
</html>

三、页面效果截图：

 （阿巴阿巴，我并没有用原素材，因为天大地大，快乐最大！！！）

更多推荐

web前端开发技术实验与实践（第三版）储久良编著 项目11