机动战士高达静态网页制作

• 应用知识点
• 作品介绍
• 首页部分代码
• 页面最终效果
• 网页源地址

应用知识点

DIV CSS布局、网页背景图、JS图片轮播、在线视频

作品介绍

机动战士高达动漫网页使用DIV CSS布局制作，作品为单页1个页面，内容方面包括：机动战士高达动漫的文字及视频介绍、动漫作者高达之父介绍以及机动战士高达的一些壁纸图片。
技术及样式方面，网页整体宽度1200PX，使用CSS设置了与选题相符的 酷炫网页背景图片，使用JS制作了顶部图片轮播，使用VIDEO标签插入了视频，作品完整，代码简单。

首页部分代码

<div class="right">
		<p>
		机动战士高达自1979年登场以来，已成为日本动画作品中最著名、最经久不衰、最庞大、也是盈利最高的系列之一。
		</p>	
	</div>
	<div class="title"><i></i>高达之父</div>
	<div class="left">
		<img src="images/tua.jpg" width="350px">
	</div>
	<div class="right">
		<p>
		富野由悠季（1941年11月5日－），为日本的动画监督、作词家、小说家。
		<br>
		出生于日本神奈川县小田原市，日本大学艺术学部映画学科毕业。
		</p>	
	</div>
	<div class="title"><i></i>精美壁纸</div>
	<div class="list">
		<ul >
		 <li><img src="images/pica.jpg" /></li>
		 <li><img src="images/picb.jpg" /></li>
		 <li><img src="images/picc.jpg" /></li>
		 <li style="margin-right:0px;"><img src="images/picd.jpg" /></li>
		 </ul>
	</div>

页面最终效果

网页源地址

stu-works/html/dongman/339.html