HTML5期末大作业:电影介绍类型网站设计——《盗梦空间》8页 (HTML+CSS+JavaScript)
作品介绍
1.网页作品简介 :HTML期末大学生网页设计作业 A+水平 ,喜欢的可以下载,文章页支持手机PC响应式布局。
2.网页作品编辑:作品下载后可使用任意HTML编辑软件(如:DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML软件编辑修改网页)。
3.网页作品技术:Div+CSS、鼠标滑过特效、Table、导航栏效果、banner、表单、二级三级页面等,视频、 音频元素 、Flash,同时设计了logo(源文件),基本期末作业所需的知识点全覆盖。
一、作品展示






二、代码实现:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/style.css" rel="stylesheet" />
<title>
</title>
</head>
<body>
<embed src="music/music.mp3" width="0" height="0">
</embed>
<div class="con">
<div class="head">
<div class="logo">
<h1>
</h1>
</div>
<div class="nav">
<ul>
<li>
<a href="index.htm">首 页</a>
</li>
<li>
<a href="page1.htm">迪士尼动画片</a>
</li>
<li>
<a href="page2.htm">公司简介</a>
</li>
<li>
<a href="page3.htm">发展过程</a>
</li>
<li>
<a href="page4.htm">电影纪录</a>
</li>
</ul>
</div>
<div class="clear">
</div>
</div>
<div class="clear">
</div>
<div class="lunbo">
<a href="#">
<img src="images/d1.jpg" width="1024" />
</a>
</div>
<div class="clear">
</div>
<div class="main">
<h2>迪士尼影业</h2>
<p>迪士尼电影公司是迄今为止唯一一家没有被交易过的好莱坞大公司。迪士尼全称为The Walt Disney Company,取名自其创始人华特·迪士尼,是总部设在美国的大型跨国公司,二十世纪三四十年代,依靠米老鼠起家,四十年代,涉足真人电影领域,先后收购了独立电影界巨头米拉麦克斯、3D动画霸主皮克斯[1] 、动漫巨头漫威和卢卡斯影业之后[2] ,迪士尼更是巩固了自己作为顶级电影公司的地位。</p>
<h2>电影纪录</h2>
<div>
<strong>世界上第一部全部对白动画片</strong>
</div>
<div>是1928年迪士尼绘制的动画片《蒸汽船威利 》(也译作《威利汽船》,《威廉号汽艇》)。这部动画片于1928年11月18日在纽约首映,也是第一次向观众介绍米老鼠这一著名动画人物。 实际上,迪士尼在同年先完成了全部有声对白动画片《飞机迷》,不过它发行于《蒸汽船威利》之后。</div>
<p> </p>
<p>
</p>
<p>
</p>
<p>
</p>
<h2>剧情剧照</h2>
<div class="main_list">
<ul>
<li>
<a href="#">
<img src="images/q1.jpg" />
</a>
</li>
<li>
<a href="#">
<img src="images/q2.jpg" />
</a>
</li>
<li>
<a href="#">
<img src="images/q3.jpg" />
</a>
</li>
<li>
<a href="#">
<img src="images/q4.jpg" />
</a>
</li>
<li>
<a href="#">
<img src="images/q5.jpg" />
</a>
</li>
<li>
<a href="#">
<img src="images/q6.jpg" />
</a>
</li>
<li>
<a href="#">
<img src="images/q7.jpg" />
</a>
</li>
<li>
<a href="#">
<img src="images/q8.jpg" />
</a>
</li>
<li>
<a href="#">
<img src="images/q9.jpg" />
</a>
</li>
<li>
<a href="#">
<img src="images/q10.jpg" />
</a>
</li>
<li>
<a href="#">
<img src="images/q11.jpg" />
</a>
</li>
<li>
<a href="#">
<img src="images/q12.jpg" />
</a>
</li>
</ul>
</div>
</div>
<div class="clear">
</div>
<div class="foot">
<p>版权所有</p>
<p>All Rights Reserved</p>
</div>
<div class="clear">
</div>
</div>
</body>
</html>

