時間:2023-09-16 12:00:01 | 來源:網(wǎng)站運營
時間:2023-09-16 12:00:01 來源:網(wǎng)站運營
dreamweaver作業(yè)靜態(tài)HTML網(wǎng)頁設計——動漫主題:天寶伏妖錄(7頁) 學生動漫網(wǎng)頁設計作品靜態(tài)HTML網(wǎng)頁模板源碼:HTML實例網(wǎng)頁代碼, 本實例適合于初學HTML的同學。該實例里面有設置了css的樣式設置,有div的樣式格局,這個實例比較全面,有助于同學的學習,本文將介紹如何通過從頭開始設計個人網(wǎng)站并將其轉換為代碼的過程來實踐設計。
<!doctype html><html><head><meta charset="utf-8"><title>無標題文檔</title><link rel="stylesheet" type="text/css" href="css/css.css"></head><body><div class="da"><div class="top"><div class="nav"><ul><li><a href="index.html">網(wǎng)站首頁</a></li><li><a href="juqing.html">劇情簡介</a></li><li><a href="jiaose.html">角色介紹</a></li><li><a href="pingjia.html">作品評價</a></li><li><a href="tuce.html">動漫圖冊</a></li></ul></div></div><div class="xia"><h1><img src="images/tt.png" width="100" height="107"></h1><h2>角色介紹</h2><div class="se"><ul><li><a href="jiaose1.html"><img src="images/a1.jpg" width="131" height="220"><br/>李景瓏</a></li><li><a href="jiaose2.html"><img src="images/a2.jpg" width="131" height="220"><br/>孔鴻俊</a></li><li><a href="#"><img src="images/a3.jpg" width="131" height="220"><br/>莫日根</a></li><li><a href="#"><img src="images/a4.jpg" width="131" height="220"><br/>裘永思</a></li><li><a href="#"><img src="images/a5.jpg" width="131" height="220"><br/>阿泰</a></li><li><a href="#"><img src="images/a6.jpg" width="131" height="220"><br/>青雄</a></li><li><a href="#"><img src="images/a7.jpg" width="131" height="220"><br/>趙子龍</a></li><li><a href="#"><img src="images/a8.jpg" width="131" height="220"><br/>重明</a></li></ul><div class="clearit"></div></div></div><div class="foot">天寶伏妖錄</div></div></body></html>
body, html, div, blockquote, img, label, p, h1, h2, h3, ul, li, form, a, th, td{margin: 0; padding: 0; border: 0; outline: none;}body { font-family: Verdana, Geneva, sans-serif;font-size: 14px;color:#000000;line-height: 20px;text-align:left; background:url(../images/b.jpg); background-size: cover }td,th {font-family: Verdana, Geneva, sans-serif;font-size: 14px;color: #000000;}a {color: #000000;} A:link {TEXT-DECORATION: none;}A:visited {TEXT-DECORATION: none;}ul,li{list-style-type:none;}.clearit{clear:both;}.da {width:1000px; margin:0 auto; background: rgba(255,255,255, 0.6 );}.top {width:1000px; height:566px; background:url(../images/t.jpg);}.nav { padding-top:516px;}.nav ul {width:1000px; height:50px; background: rgba(0,0,0, 0.5 ); }.nav ul li {width:200px; float:left; text-align:center; line-height:50px;}.nav ul li a { font-size:16px; font-weight:bold; color:#FFF; width:200px; height:50px; display:block;}.nav ul li A:hover { background: #333;}.xia {padding:20px;}h1 { text-align:center;}.xia h2 { margin-bottom:20px}.zi { margin-top:20px; line-height:30px; letter-spacing:2px;}.ta {border-collapse: collapse; margin-top:20px;}.ta tr{ border-bottom:1px dotted #666666;}.ta td {padding:8px;}.zi li { width:320px; float:left; text-align:center;}.foot {width:1000px; height:60px; background: rgba(0,0,0, 0.9 ); text-align:center; line-height:60px; font-size:16px; font-weight:bold; color:#FFF; margin-top:30px;}.se li { width:240px; float:left; text-align:center; margin-top:20px; line-height:30px;}.se li A:hover { color:#666;}
請 “ 點贊” “??評論” “ 收藏”
一鍵三連哦!??【關注我| 獲取更多源碼 | 優(yōu)質(zhì)文章】
帶您學習各種前端插件、3D炫酷效果、圖片展示、文字效果、以及整站模板 、大學生畢業(yè)HTML模板 、期末大作業(yè)模板 、等! 「在這里有好多 前端 開發(fā)者,一起探討 前端 Node 知識,互相學習」!關鍵詞:學生,天寶,主題,靜態(tài),設計,作業(yè)
微信公眾號
版權所有? 億企邦 1997-2025 保留一切法律許可權利。