サマリー:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>淘寶導(dǎo)航</title> <link rel="stylesheet" type="text/css"
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>淘寶導(dǎo)航</title> <link rel="stylesheet" type="text/css" href="css/index.css"> <link rel="stylesheet" type="text/css" href="css/font-awesome-4.7.0/css/font-awesome.min.css"> </head> <body> <div style="width: 100%;height: 50px;background: red"></div> <div> <div> <div> <a href="" >中國(guó)大陸 <i class=" fa fa-angle-down"></i></a> <a href="" style="color: #FF5000">親,請(qǐng)登錄</a> <a href="">免費(fèi)注冊(cè)</a> <a href="">手機(jī)逛淘寶</a> </div> <div> <a href="">我的淘寶 <i class=" fa fa-angle-down"></i> <ul> <li>已買到的寶貝</li> <li>我的足跡</li> </ul> </a> <a href=""><i style="color: #ff5000" class=" fa fa-shopping-cart"></i> 購(gòu)物車 <i class=" fa fa-angle-down"></i> </a> <a href=""><i class="fa fa-star"></i> 收藏夾 <i class=" fa fa-angle-down"></i> <ul> <li>收藏的寶貝</li> <li>收藏的店鋪</li> </ul> </a> <a href="">商品分類</a> <a href="">賣家中心 <i class=" fa fa-angle-down"></i> <ul> <li>免費(fèi)開店</li> <li>已賣出的寶貝</li> <li>出售中的寶貝</li> <li>賣家服務(wù)市場(chǎng)</li> <li>賣家培訓(xùn)中心</li> <li>體驗(yàn)中心</li> <li>問商友</li> </ul> </a> <a href="">聯(lián)系客服 <i class=" fa fa-angle-down"></i> <ul> <li>消費(fèi)者客服</li> <li>賣家客服</li> </ul> </a> <a href=""><i style="color: #ff5000" class="fa fa-reorder "></i> 網(wǎng)站導(dǎo)航 <i class=" fa fa-angle-down"></i></a> </div> </div> <div></div> </div> </body> </html>
*{margin: 0px;padding: 0px;} .clear{clear: both;} .header{width: 100%;background-color: #ccc;} .header_content{width: 1188px;margin: 0px auto;line-height: 36px;} .header_content a:hover{color: #ff5000;} .header_a{display: inline-block;width: 80px;height: 36px;text-align: center;position: relative;} .header_a:hover{background-color: #fff;} .header_content_left{float: left; height: 36px;text-align: center;border: 0px;} .header_content_left a{margin: 0px 5px;} .header_content_right{float: right; height: 36px;text-align: center;} a{text-decoration:none;font-size: 13px;color: #6c6c6c;} li{list-style: none;} .header_a ul{display: none;border: 1px solid #ccc;border-top: none;} .header_a:hover ul {display: block;width: 90px;position: absolute;} .header_a ul li{color: #6c6c6c;text-align: left;height: 30px;line-height: 30px;padding: 0px 3px;margin: 6px 0px;} .header_a ul li:hover{background: #ccc;}
總結(jié):頁(yè)面布局要細(xì)心,做每一塊內(nèi)容的時(shí)候思路要清晰,不然很容易作亂,出錯(cuò)也不知從何看起。
添削の先生:查無此人添削時(shí)間:2019-01-11 16:06:12
先生のまとめ:嗯,說的不錯(cuò),作業(yè)也不錯(cuò)。代碼要縮進(jìn),這樣方便閱讀,有錯(cuò)誤能及時(shí)找到。加油