abstract：<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="shortcut icon" type="images/x-icon" href="static/img/footlogo.png">
<link rel="stylesheet" href="static/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="static/style/main.css">
<title>小米商城首頁(yè)</title>
</head>
<body>
<!--header部分-->
<div class="head">
<div class="menu">
menu
</div>
</div>
<!--主體部分-->
<div class="contents mt20">
<div class="content w1300">
<div class="contentNav w1300 mt15">contentNav</div>
<div class="contentBanner w1300 mt10">
<div class="contentBanner_l"></div>
<div class="contentBanner_r"></div>
</div>
<div class="clear"></div>
<div class="contentPro w1300 mt10">
<div class="contentPro_1"></div>
<div class="contentPro_2" style="background: url(static/img/midAD1.jpg)"></div>
<div class="contentPro_2" style="background: url(static/img/midAD2.jpg)"></div>
<div class="contentPro_2" style="background: url(static/img/midAD3.jpg);margin-right:0"></div>
</div>
<div class="clear"></div>
<div class="contentShop w1300 mt20">
小米上鉤
</div>
<div class="contentpic w1300 mt15"><img src="static/img/longAD1.jpg" alt=""></div>
<div class="contentPhone w1300 mt20">手機(jī)</div>
<div class="contentpic w1300 mt15"><img src="static/img/longAD2.jpg" alt=""></div>
<div class="contentZhi w1300 mt20">智能</div>
<div class="contentpic w1300 mt15"><img src="static/img/longAD3.jpg" alt=""></div>
<div class="contentDian w1300 mt20">家電</div>
<div class="contentpic w1300 mt15"><img src="static/img/longAD4.jpg" alt=""></div>
</div>
</div>
<!--footer部分-->
<div class="footers mt20">
<div class="footer w1300 mt20">
<div class="footer_t">
<a href="javascript:;"><i class="fa fa-wrench"></i>預(yù)約維修服務(wù)</a>|
<a href="javascript:;"><i class="fa fa-rotate-right"></i>7天無(wú)理由退貨</a>|
<a href="javascript:;"><i class="fa fa-refresh"></i>15天免費(fèi)換貨</a>|
<a href="javascript:;"><i class="fa fa-gift"></i>滿150元包郵</a>|
<a href="javascript:;"><i class="fa fa-map-marker"></i>520余家售后網(wǎng)點(diǎn)</a>
</div>
<div class="clear"></div>
<div class="footer_c mt10">
<div>
<a href="" class="footer_c_title">幫助中心</a><br>
<a href="">賬戶(hù)管理</a><br>
<a href="">購(gòu)物指南</a><br>
<a href="">訂單操作</a>
</div>
<div>
<a href="" class="footer_c_title">服務(wù)支持</a><br>
<a href="">自助服務(wù)</a><br>
<a href="">相關(guān)下載</a><br>
<a href="">售后政策</a>
</div>
<div>
<a href="" class="footer_c_title">線下門(mén)店</a><br>
<a href="">小米之家</a><br>
<a href="">服務(wù)網(wǎng)點(diǎn)</a><br>
<a href="">授權(quán)體驗(yàn)店</a>
</div>
<div>
<a href="" class="footer_c_title">關(guān)于小米</a><br>
<a href="">了解小米</a><br>
<a href="">加入小米</a><br>
<a href="">投資者關(guān)系</a>
</div>
<div>
<a href="" class="footer_c_title">關(guān)注我們</a><br>
<a href="">新浪微博</a><br>
<a href="">官網(wǎng)微博</a><br>
<a href="">聯(lián)系我們</a>
</div>
<div style="border-right: 1px solid #ccc">
<a href="" class="footer_c_title">特色服務(wù)</a><br>
<a href="">F碼通道</a><br>
<a href="">禮物碼</a><br>
<a href="">防偽查詢(xún)</a>
</div>
<div class="footer_c_content mt10" style="width: 20%;text-align: center">
<p>Feir-520-1314</p>
<p>周一至周日 8:00-18:00 <br>(僅收市話費(fèi))</p>
<p class="mt10"><a href=""><i class="fa fa-commenting"></i> 聯(lián)系客服</a></p>
</div>
</div>
<div class="clear"></div>
<div class="footer_f mt20">
<div><img src="static/img/footlogo.png" alt=""></div>
<div>
<p>
<a href="">小米商城</a>|
<a href="">MIUI</a>|
<a href="">米家</a>|
<a href="">米聊</a>|
<a href="">多看</a>|
<a href="">游戲</a>|
<a href="">路由器</a>|
<a href="">米粉卡</a>|
<a href="">政企服務(wù)</a>|
<a href="">小米天貓店</a>|
<a href="">隱私政策</a>|
<a href="">問(wèn)題反饋</a>|
<a href="">Select Region</a>
</p>
<p>
?mi.com
京ICP證110507號(hào)
京ICP備10046444號(hào)
京公網(wǎng)安備11010802020134號(hào)
京網(wǎng)文[2014]0059-0009號(hào)
</p>
<p>違法和不良信息舉報(bào)電話：185-0130-1238，本網(wǎng)站所列數(shù)據(jù)，除特殊說(shuō)明，所有數(shù)據(jù)均出自我司實(shí)驗(yàn)室測(cè)試</p>
</div>
<div>
<img src="static/img/footericon1.png" alt="" >
<img src="static/img/footericon2.png" alt="">
<img src="static/img/footericon3.png" alt="">
<img src="static/img/footericon4.png" alt="">
<img src="static/img/footericon5.png" alt="">
</div>
</div>
</div>
</div>
</body>
</html>
//css部分
*{margin: 0px; padding: 0px;}
li{list-style:none;}
a{text-decoration: none;color: #ccc;cursor: pointer;}
img{margin: 0;padding: 0}
.w1300{width: 1300px}
.clear{clear: both;}
.mt5{margin-top: 5px;}
.mt10{margin-top: 10px;}
.mt15{margin-top: 15px}
.mt20{margin-top: 20px}
/*head*/
.head{background-color: #333;width: 100%;height: 40px}
.menu{width: 1300px;background-color: #ccc;margin: 0 auto;height: 40px}
/*主體部分*/
.content{margin: 0 auto;}
.contentNav{height: 100px;background-color: #ccc}
.contentBanner{background-color: #ccc}
.contentBanner_l{width:260px ;height: 480px;background-color: blue;float: left}
.contentBanner_r{width: 1040px;height: 480px;float: left;background-color:#ccc}
.contentPro div{float: left}
.contentPro_1{width: 260px;background-color: #2196f3;height: 170px;margin-right: 31px}
.contentPro_2{width: 316px;height: 170px;margin-right: 30px;}
.contentShop{height: 400px;background-color: #ccc}
.contentpic img{width: 100%}
.contentPhone{height: 400px;background-color: #ccc}
.contentDian{height: 400px;background-color: #ccc}
.contentZhi{height: 400px;background-color: #ccc}
/*footer部分*/
.footer{margin: 0 auto}
.footer_t{border-bottom: 1px solid #ccc;padding-bottom: 30px}
.footer_t a{width: 19.4%;display: inline-block;text-align: center;color:#616161;font-size: 16px}
.footer_t a i{margin-right: 16px}
.footer_c a{color:#616161;font-size: 12px;display: inline-block;margin-top: 10px}
.footer_c a:hover{color:#ff6700}
.footer_c > div{width: 13.3%;float: left;text-align: left}
.footer_c_title{color:#424242;font-size: 16px!important;display: inline-block;margin-bottom: 14px}
.footer_c_title:hover{color:#616161!important;}
.footer_c_content p:nth-child(1){color: #ff6700;font-size: 22px}
.footer_c_content p:nth-child(2){color: #616161;font-size: 12px}
.footer_c_content a{padding: 5px 22px;color: #ff6700;font-size: 12px;border: 1px solid #ff6700}
.footer_c_content a:hover{background-color: #ff6700;color: #fff}
.footer_f > div{float: left}
.footer_f > div:nth-child(1){margin-right: 20px}
.footer_f > div p:nth-child(2){line-height: 20px}
.footer_f > div:nth-child(2) a{color: #757575;font-size: 12px;margin-right: 5px}
.footer_f > div:nth-child(2) p:nth-child(2){color: #b0b0b0;font-size: 12px}
.footer_f > div:nth-child(2) p:nth-child(3){color: #b0b0b0;font-size: 12px}
.footer_f > div:nth-child(3){width: 523px;text-align: center;padding-top: 15px}
.footer_f>div:nth-child(3) img{display: inline-block;}
.footer_f>div:nth-child(3) img:nth-child(1){width: 85px;height: 28px}
Correcting teacher：天蓬老師Correction time：2019-04-04 14:30:56
Teacher's summary：/longAD4.jpg, 這樣文件名是不建議的, 應(yīng)該始終堅(jiān)持用小寫(xiě)加下劃線的語(yǔ)法,例如: long_ad_4.jpg