银翼杀手2049电影网页设计制作

• 知识点应用
• 作品介绍
• 网页成品效果预览
• HTML代码预览
• • 导航代码
  • 图片列表代码
• 作品源地址

知识点应用

DIV CSS布局、网页背景图片、网页背景音乐、图片列表、字体样式

作品介绍

银翼杀手2049电影静态网页作业设计了5个页面，采用DIV CSS布局制作，网页作品中的内容来源于百科，包括：网站首页、剧情简介、角色介绍、幕后制作、原著小说。
网页设计整体宽度为1200PX，页面都使用CSS设置了网页背景图片，首页插入了背景音乐（可点击播放或暂停）导航部分使用CSS制作了鼠标经过变色。作品完整界面漂亮，但并不难，属于学生基础水平简单网页制作作品。

网页成品效果预览

HTML代码预览

导航代码

		<div class="nav">
		<ul>
		<a href=""><li>网站首页</li></a>
		<a href=""><li>剧情简介</li></a>
		<a href=""><li>角色介绍</li></a>
		<a href=""><li>幕后制作</li></a>
		<a href=""><li>原著小说</li></a>
		</ul>
		</div>

图片列表代码

<div class="list">
		 <ul >
		 <li><img src="images/img003.jpg" /></li>
		 <li><img src="images/img004.jpg" /></li>
		 <li><img src="images/img005.jpg" /></li>
		 <li><img src="images/img006.jpg" /></li>
		 <li><img src="images/img007.jpg" /></li>
		 <li style="margin-right:0px;"><img src="images/img008.jpg" /></li>
		 </ul>
   </div>

作品源地址

stu-works/html/dianying/330.html