大學生影視主題網頁製作 銀翼殺手2049電影網頁設計模板 學生靜態網頁作業成品 dreamweaver電影HTML網站製作

STU網頁發表於2020-11-27

知識點應用

DIV CSS佈局、網頁背景圖片、網頁背景音樂、圖片列表、字型樣式

作品介紹

銀翼殺手2049電影靜態網頁作業設計了5個頁面,採用DIV CSS佈局製作,網頁作品中的內容來源於百科,包括:網站首頁、劇情簡介、角色介紹、幕後製作、原著小說。
網頁設計整體寬度為1200PX,頁面都使用CSS設定了網頁背景圖片,首頁插入了背景音樂(可點選播放或暫停)導航部分使用CSS製作了滑鼠經過變色。作品完整介面漂亮,但並不難,屬於學生基礎水平簡單網頁製作作品。

網頁成品效果預覽

銀翼殺手2049電影網頁設計模板

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>

作品源地址

www.lilixing.com/html/dianying/330.html

相關文章