abstract:/*css部分*/*{margin:0;padding:0;}li{list-style:none;}a{text-decoration:none;color:#ccc;cursor:pointer;}.fl{float:left;}.fr{float:right;}.clear{clear:both;}/*頭部樣式*/.header{background:#333;width:100%;heig
/*css部分*/
*{margin:0;padding:0;}
li{list-style:none;}
a{text-decoration:none;color:#ccc;cursor:pointer;}
.fl{float:left;}
.fr{float:right;}
.clear{clear:both;}
/*頭部樣式*/
.header{background:#333;width:100%;height:40px;}
.menu{width:1226px;height:40px;margin:0 auto;}
.menu{font-size: 12px;}
.menu-left li{float:left;line-height: 40px;}
.menu-left li a:hover{color:#fff;}
.menu-left li span{margin: 0 10px;color:#6c6d69;}
.menu-right{float:right;}
.menu-right li{float:left;line-height: 40px;}
.menu-right li a:hover{color:#fff;}
.menu-right li span{margin: 0 10px;color:#6c6d69;}
.buy-car{width:120px;height:40px;text-align:center;background: #424242;color:#aaa;margin-left: 10px;position:relative;}
.buy-box{width:300px;height:90px;background: #fff;color:#ccc;position:absolute;right:0px;display:none;z-index: 99;}
.buy-car:hover .buy-box{display:block;}
.buy-car:hover{color:#ff6700;background:#fff;}
.buy-car:hover a{color:#ff6700;}
/*主體樣式*/
.content{width:1226px;margin:10px auto;}
.outContent{width:100%;background: #f5f5f5;}
.contentMenu{width:100%;height:66px;margin:10px auto;}
.menuUl{line-height: 66px;height:66px;margin-left: 15px;}
.menuUl li{float:left;margin-right: 10px;}
.menuUl li:hover .menuPhone{display: block;}
.menuPhone{display:none;width:100%;height:230px;background: #fff;border-top:1px solid #ccc;border-bottom: 1px solid #ccc;position:absolute;left:0px;top:126px;}
.phoneItems{width:1226px;height:230px;margin:0 auto;}
.phoneItems span{width:0px;height:80px;border-right:1px solid #ccc;float:left;margin-top: 48px;}
.phoneItem{width:181px;height:230px;line-height:230px;text-align: center;font-size: 12px;color:#aaa;}
.new{width:60px;height:18px;border:1px solid #ff6700;color:#ff6700;line-height: 18px;text-align: center;margin: 10px auto 20px;}
.phoneNew{line-height: 30px;}
.menuForm{width:314px;height:63px;position:relative;margin-top: 5px;}
.menuForm input{width:240px;height:50px;float:left;border-left:1px solid #ccc;border-top:1px solid #ccc;border-bottom:1px solid #ccc;padding-left: 10px;}
.button{border:1px solid #ccc;height:50px;width:50px;float:left;line-height: 50px;text-align: center;}
.button i{font-size: 22px;color:#424242;}
.button:hover{background: #ff6700;width:52px;height:52px;border:none;}
.button:hover i{color: #fff;}
.menuFrom-a{position:absolute;top:20px;left:140px;font-size:12px;background: #ebebeb;color:#aaa;}
.menuFrom-b{position:absolute;top:20px;left:200px;font-size:12px;background: #ebebeb;color:#aaa;}
.menuFrom-a a:hover{background: #ff6700;}
.menuFrom-b a:hover{background: #ff6700;}
.contentPic{width:100%;margin:10px auto;}
.contentPic_l{width:246px;height:460px;background:#424242;}
.contentPic_l ul{width:246px;height:440px;margin:30px 0px;}
.contentPic_l ul li{width:236px;height:40px;line-height:40px;font-size: 15px;color:#fff;padding-left: 10px;position:relative;}
.contentPic_l ul li i{font-weight:bold;font-size: 15px;float:right;line-height: 40px;margin-right: 20px;}
.contentPic_l ul li:hover{background: #ff6700;}
.contentPic_l ul li a:hover{color: #fff;}
.contentPic_l ul li:hover .lMennitem{display: block;}
.lMennitem{width:800px;height:460px;position:absolute;top:-30px;left:246px;background: #fff;display: none;}
.lMennitem-1{float:left;margin: 25px 0px;}
.lMennitem-1 img{float:left;width:40px;height:40px;margin-left:10px;}
.lMennitem-1 div{float:left;width: 250px;height:40px;}
.lMennitem-1 div a{float:left;color:#424242;}
.lMennitem-1 div:hover a{color:#ff6700!important;}
.lMennitem-1 div a{color:#ff6700;}
.contentPic_r{width:980px;height:460px;background:#4c004c;}
.contentPic-ul{width:100%;height:170px;margin:10px auto;}
.contentPic-ul-1{width:235px;height:170px;background:#5f5750;margin-right:13px;}
.conPan ul{padding:20px 10px;}
.conPan ul li{float:left;color:#ccc;font-size: 15px;line-height: 30px;text-align:center;width:60px;margin-bottom: 10px;}
.contentPic-ul-2{width:317px;height:170px;}
/*小米閃購*/
.contentShop{width:100%;margin:10px auto;}
.contentShop-1{width:235px;height:340px;background:;text-align: center;position:relative;}
.time{height:30px;line-height:30px;text-align:center;margin:30px auto 10px;color:red;font-size: 22px;}
.flashIcon{height:80px;line-height:80px;text-align:center;}
.start{height:50px;line-height:50px;text-align:center;}
.clock{width:100%;height:46px;line-height:46px;text-align:center;color:#605751;font-size:24px;}
.clock span{display: inline-block;color:#fff;}
.clock .time{background: #605757;width: 46px;height: 46px;line-height: 46px;text-align: center;}
.contentShop-1 .shopImg img{width:160px;height:160px;margin:30px auto 10px;}
.contentShop-1 .shopTitle{font-size:14px;color:#616161;}
.contentShop-1 .shopDetail{font-size:12px;color:#ccc;margin:10px 0px;}
.contentShop-1 .bg{background: rgba(0,0,0,0.02);width:100%;height:100%;position:absolute;top:0px;left:0px;}
.shopPirce{font-size:12px;color:#ccc;}
.shopPirce span{font-size:12px;color:#ff6100;margin-right:20px; }
.contentImg{width:100%;height:100px;margin:10px auto;}
.contentUl{width:100%;height:60px;margin:10px auto;line-height: 60px;text-align: center;}
.contentUl h2{font-size: 20px;font-weight: 400px;margin-left:10px;}
.contentUl div{float:right;margin-right: 10px;}
.contentUl div span{float:right;width:20px;height:20px;background: #ccc;border-radius:10px;display: block;line-height: 20px;text-align: center;margin-top: 20px;margin-left: 10px;color:#fff;}
.contentUl div ul{float:right;margin:15px 0px;}
.contentUl div ul li{float:left;margin-right:10px; height: 30px;line-height: 30px;text-align: center;}
.contentUl div ul li:hover{color:#ff6700;border-bottom: 2px solid #ff6700; }
.contentPhone{background:#ccc;margin:10px auto;}
.contentPhone-1{background:#ccc;width:234px;height:614px;background:url(../img/buy/手機AD.jpg);margin-right: 12px;}
.contentPhone-2{width:980px;height:614px;text-align: center;}
.contentPhone-2 div{background:#fff;width:235px;height:300px;float:left;}
.conItem{color:#616161;font-size:12px;position: relative;}
.conItem img{witdh:160;height:160px;margin-top:20px;}
.conItem p{margin:10px auto;}
.conFlag{width:80px;background: red;color:#fff;position: absolute;left:80px;top:0px;}
.contentPhone-a{width: 235px;height:300px;background:#fff;}
.contentPhone-b{width: 235px;height:300px;background:#fff;text-align: center;position: relative;}
.contentPhone-b:hover .disSucces{display: block}
.contentPhone-b-1{width: 235px;height:145px;background:#ccc;}
.disSucces{display:none;width:235px;height:45px;background: #ff6700;color:#fff;padding-top: 10px;position:absolute;top:235px;left:0px;}
/*底部內(nèi)容*/
.footer{background:#fff;width:1226px;height:100px;margin:10px auto;}
.foot-top{width:100%;height:80px;line-height:80px;text-align:center;}
.foot-top a{font-size: 16px;color:#616161;font-weight:300px;}
.foot-top a:hover{color:orange;}
.foot-top span{font-size: 20px;color:#616161;border-left:1px solid #e0e0e0;margin:0px 56px;}
.separate{border:1px solid #e0e0e0;display:block;}
.foot-middle{margin-top: 20px;}
.foot-middle dl{float:left;width:160px;}
.foot-middle dt{font-size:14px;line-height:14px;color:#424242;margin-bottom:26px;}
.foot-middle dd{font-size:12px;line-height:12px;color:#424242;margin-top:10px;}
.foot-middle dd a{color:#757575;}
.foot-middle dd a:hover{color:#ff6700;}
.connect{width:258px;height:112px;border-left:1px solid #e0e0e0;float:right;text-align:center;}
.tele{color:#ff6700;margin:0 0 5px;font-size:22px;line-height: 22px;}
.timer{color:#616161;margin:0px 16px;font-size: 12px;}
.connect button{border:1px solid #ff6700;width:118px;height:28px;font-size: 12px;line-height:28px;color:#ff6700;background:#fff;margin-top: 20px;}
.connect button:hover{background: #ff6700;color:#fff;}
.foot-bottom{margin-top: 20px;}
.foot-bottom-middle-a{width:640px;}
.foot-bottom-middle ul li{height:19px;float:left;font-size: 12px;}
.foot-bottom-middle span{height:2px;color:#757575;border-left:1px solid #b0b0b0;margin:3px 3px;}
.foot-bottom-middle-b{width:640px;color:#b0b0b0;font-size: 12px;margin-top: 5px;display: inline-block;}
.foot-bottom-right img{width:83px;}
/*index.html*/
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>小米商城</title>
<link rel="shortcut icon" type="image/x-icon" href="static/images/footlogo.png">
<link rel="stylesheet" type="text/css" href="static/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="static/css/style.css">
</head>
<body>
<!-- 頭部 -->
<div class="header">
<div class="menu">
<ul class="menu-left">
<li><a href="#">小米高城</a><span>|</span></li>
<li><a href="#">MIUI</a><span>|</span></li>
<li><a href="#">IOT</a><span>|</span></li>
<li><a href="#">云服務(wù)</a><span>|</span></li>
<li><a href="#">小愛分享平臺</a><span>|</span></li>
<li><a href="#">金融</a><span>|</span></li>
<li><a href="#">有品</a><span>|</span></li>
<li><a href="#">企業(yè)服務(wù)</a><span>|</span></li>
<li><a href="#">SelectRegion</a><span>|</span></li>
</ul>
<ul class="menu-right">
<li><a href="#">登錄</a><span>|</span></li>
<li><a href="#">注冊</a><span>|</span></li>
<li><a href="#">我的訂單</a></li>
<li class="buy-car"><a href="#"><i class="fa fa-shopping-cart"></i>購物車(0)</a>
<div class="buy-box">購物車中還沒有商品,趕緊選購吧</div>
</li>
</ul>
</div>
</div>
<!-- 主體部分 -->
<div class=content>
<div class="contentMenu">
<div class="menuPic fl">
<img src="static/img/footlogo.png" style="margin:5px 0px;margin-right:10px;">
<img src="static/img/logoAD.gif">
</div>
<ul class="menuUl fl">
<li>小米手機
<div class="menuPhone">
<div class="phoneItems">
<div class="phoneItem fl">
<div class="new">新品</div>
<div class="phoneNew">
<img src="static/img/phone/phone1.png">
<br><a href="#">小米2S</a>
<br><a href="#" style="color:#ff6700;">3299</a>
</div>
</div>
<span></span>
<div class="phoneItem fl">
<div class="new">新品</div>
<div class="phoneNew"><img src="static/img/phone/phone1.png">
<br><a href="#">小米2S</a>
<br><a href="#" style="color:#ff6700;">3299</a>
</div>
</div>
<span></span>
<div class="phoneItem fl">
<div class="new">新品</div>
<div class="phoneNew"><img src="static/img/phone/phone1.png">
<br><a href="#">小米2S</a>
<br><a href="#" style="color:#ff6700;">3299</a>
</div>
</div>
<span></span>
<div class="phoneItem fl">
<div class="new">新品</div>
<div class="phoneNew"><img src="static/img/phone/phone1.png">
<br><a href="#">小米2S</a>
<br><a href="#" style="color:#ff6700;">3299</a>
</div>
</div>
</div>
</div>
</li>
<li>紅米</li>
<li>電視</li>
<li>筆記本</li>
<li>盒子</li>
<li>新品</li>
<li>路由器</li>
<li>智能硬件</li>
<li>服務(wù)</li>
<li>社區(qū)</li>
</ul>
<div class="menuForm fr">
<form>
<input type="text" name="">
<div class="menuFrom-a"><a href="#">電視新品</a></div>
<div class="menuFrom-b"><a href="#">618預(yù)熱</a></div>
<div class="button"><i class="fa fa-search"></i></div>
</form>
</div>
</div>
<div class="clear"></div>
<div class="contentPic">
<div class="contentPic_l fl">
<ul>
<li><a href="">手機 電話卡</a><i class="fa fa-angle-right"></i>
<div class="lMennitem">
<div class="lMennitem-1">
<div><img src="static/img/phone/phone1.png"><a href="">紅米6A</a></div>
<div><img src="static/img/phone/phone2.png"><a href="">紅米6A</a></div>
<div><img src="static/img/phone/phone3.png"><a href="">紅米6A</a></div>
</div>
<div class="lMennitem-1">
<div><img src="static/img/phone/phone1.png"><a href="">紅米6A</a></div>
<div><img src="static/img/phone/phone2.png"><a href="">紅米6A</a></div>
<div><img src="static/img/phone/phone3.png"><a href="">紅米6A</a></div>
</div>
<div class="lMennitem-1">
<div><img src="static/img/phone/phone1.png"><a href="">紅米6A</a></div>
<div><img src="static/img/phone/phone2.png"><a href="">紅米6A</a></div>
<div><img src="static/img/phone/phone3.png"><a href="">紅米6A</a></div>
</div>
</div>
</li>
<li><a href="">電視機 盒子</a><i class="fa fa-angle-right"></i></li>
<li><a href="">筆記本</a><i class="fa fa-angle-right"></i></li>
<li><a href="">智能 家電</a><i class="fa fa-angle-right"></i></li>
<li><a href="">健康 家居</a><i class="fa fa-angle-right"></i></li>
<li><a href="">出行 兒童</a><i class="fa fa-angle-right"></i></li>
<li><a href="">路由器 手機配件</a><i class="fa fa-angle-right"></i></li>
<li><a href="">移動電源 插線板</a><i class="fa fa-angle-right"></i></li>
<li><a href="">耳機 音箱</a><i class="fa fa-angle-right"></i></li>
<li><a href="">生活 米免</a><i class="fa fa-angle-right"></i></li>
</ul>
</div>
<div class="contentPic_r fl"></div>
<div class="clear"></div>
</div>
<div class="clear"></div>
<div class="contentPic-ul">
<div class="contentPic-ul-1 fl" >
<div class="conPan">
<ul>
<li style="margin-right:12.7px;"><i class="fa fa-mobile-phone fa-2x"></i><br>選購手機</li>
<li style="margin-right:12.7px;"><i class="fa fa-gift fa-2x"></i><br><span>企業(yè)團購</span></li>
<li><i class="fa fa-facebook fa-2x"></i><br><span>F碼通道</span></li>
<li style="margin-right:12.7px;"><i class="fa fa-file-text fa-2x"></i><br><span>米粉卡</span></li>
<li style="margin-right:12.7px;"><i class="fa fa-refresh fa-2x"></i><br><span>以舊換新</span></li>
<li><i class="fa fa-credit-card fa-2x"></i><br><span>話費沖值</span></li>
</ul>
</div>
</div>
<div class="contentPic-ul-2 fl" style="background:url(static/img/midAD1.jpg);margin-right:13px;"></div>
<div class="contentPic-ul-2 fl" style="background:url(static/img/midAD2.jpg);margin-right:13px;"></div>
<div class="contentPic-ul-2 fl" style="background:url(static/img/midAD3.jpg);"></div>
</div>
<div class="clear"></div>
<!-- 小米閃購 -->
<div class="contentShop">
<h2 style="margin-bottom:10px;">小米閃購</h2>
<div class="contentShop-1 fl" style="margin-right:12px;border-top:1px solid red;background:#f1ebeb;">
<div class="time">18:00場</div>
<div class="flashIcon"><i class="fa fa-flash fa-4x" style="color:#ef3a3b"></i></div>
<div class="start">距離開始還有</div>
<div class="clock">
<span class="time">00</span>
<span style="color:#605757">:</span>
<span class="time">00</span>
<span style="color:#605757">:</span>
<span class="time">00</span>
</div>
</div>
<div class="contentShop-1 fl" style="margin-right:12px;border-top:1px solid blue;">
<div class="shopImg"><img src="static/img/flashbuy/flashbuy1.jpg"></div>
<p class="shopTitle">米家空氣凈化器Pro白色</p>
<p class="shopDetail">大空調(diào),快循環(huán)</p>
<p class="shopPirce"><span>1399元</span><del>1399元</del></p>
<div class="bg"></div>
</div>
<div class="contentShop-1 fl" style="margin-right:12px;border-top:1px solid orange;">
<div class="shopImg"><img src="static/img/flashbuy/flashbuy2.jpg"></div>
<p class="shopTitle">米家空氣凈化器Pro白色</p>
<p class="shopDetail">大空調(diào),快循環(huán)</p>
<p class="shopPirce"><span>1399元</span><del>1399元</del></p>
<div class="bg"></div>
</div>
<div class="contentShop-1 fl" style="margin-right:13px;border-top:1px solid green;">
<div class="shopImg"><img src="static/img/flashbuy/flashbuy3.jpg"></div>
<p class="shopTitle">米家空氣凈化器Pro白色</p>
<p class="shopDetail">大空調(diào),快循環(huán)</p>
<p class="shopPirce"><span>1399元</span><del>1399元</del></p>
<div class="bg"></div>
</div>
<div class="contentShop-1 fl" style="border-top:1px solid orange;">
<div class="shopImg"><img src="static/img/flashbuy/flashbuy1.jpg"></div>
<p class="shopTitle">米家空氣凈化器Pro白色</p>
<p class="shopDetail">大空調(diào),快循環(huán)</p>
<p class="shopPirce"><span>1399元</span><del>1399元</del></p>
<div class="bg"></div>
</div>
</div>
<div class="clear"></div>
<div class="contentImg" style="background:url(static/img/longAD1.jpg)"></div>
</div>
<div class="outContent">
<div class="content">
<div class="contentUl">
<h2 class="fl">手機</h2>
<div class="fr">查看更多<span><i class="fa fa-angle-right"></i></span></div>
</div>
<div class="contentPhone">
<div class="contentPhone-1 fl"></div>
<div class="contentPhone-2 fl">
<div class="conItem" style="margin-right:12.7px;">
<img src="static/img/buy/手機1.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
</div>
<div class="conItem" style="margin-right:12.7px;">
<span class="conFlag">享八折</span>
<img src="static/img/buy/手機2.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
</div>
<div class="conItem" style="margin-right:12.7px;">
<img src="static/img/buy/手機3.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
</div>
<div class="conItem">
<img src="static/img/buy/手機4.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
</div>
<div class="conItem" style="margin-right:12.7px;margin-top:12.7px;">
<img src="static/img/buy/手機5.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
</div>
<div class="conItem" style="margin-right:12.7px;margin-top:12.7px;">
<img src="static/img/buy/手機6.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
</div>
<div class="conItem" style="margin-right:12.7px;margin-top:12.7px;">
<img src="static/img/buy/手機7.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
</div>
<div class="conItem" style="margin-top:12.7px;">
<img src="static/img/buy/手機8.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
</div>
</div>
</div>
<div class="clear"></div>
<div class="contentImg" style="background:url(static/img/longAD2.jpg)"></div>
<div class="contentUl">
<h2 class="fl">家電</h2>
<div class="fr">
<ul>
<li>熱門</li>
<li>電視影音</li>
<li>電腦</li>
<li>家居</li>
</ul>
</div>
</div>
<div class="contentPhone">
<div class="contentPhone-a fl" style="margin-right:12.7px;background:url(static/img/buy/家電AD1.jpg)"></div>
<div class="contentPhone-b conItem fl" style="margin-right:12.7px">
<img src="static/img/buy/家電1.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
<p class="disSucces">
<span>安裝師傅很給力<br>
來自于某某的評價
</span>
</p>
</div>
<div class="contentPhone-b conItem fl" style="margin-right:12.7px">
<img src="static/img/buy/家電2.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
<p class="disSucces">
<span>安裝師傅很給力<br>
來自于某某的評價
</span>
</p>
</div>
<div class="contentPhone-b conItem fl" style="margin-right:12.7px">
<img src="static/img/buy/家電3.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
<p class="disSucces">
<span>安裝師傅很給力<br>
來自于某某的評價
</span>
</p>
</div>
<div class="contentPhone-b conItem fl">
<img src="static/img/buy/家電4.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
<p class="disSucces">
<span>安裝師傅很給力<br>
來自于某某的評價
</span>
</p>
</div>
<div class="contentPhone-a fl" style="margin-right:12.7px;margin-top:12.7px;background:url(static/img/buy/家電AD2.jpg)"></div>
<div class="contentPhone-b conItem fl" style="margin-right:12.7px;margin-top:12.7px;">
<img src="static/img/buy/家電6.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
<p class="disSucces">
<span>安裝師傅很給力<br>
來自于某某的評價
</span>
</p>
</div>
<div class="contentPhone-b conItem fl" style="margin-right:12.7px;margin-top:12.7px;">
<img src="static/img/buy/家電6.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
<p class="disSucces">
<span>安裝師傅很給力<br>
來自于某某的評價
</span>
</p>
</div>
<div class="contentPhone-b conItem fl" style="margin-right:12.7px;margin-top:12.7px;">
<img src="static/img/buy/家電7.jpg">
<h3>小米5X 4G 64GB</h3>
<p>光學(xué)變焦雙攝,拍人更美</p>
<p style="color:#ff6700">1499元</p>
<p class="disSucces">
<span>安裝師傅很給力<br>
來自于某某的評價
</span>
</p>
</div>
<div class="contentPhone-b fl" style="margin-top:12.7px;">
<div class="contentPhone-b-1">11</div>
<div class="contentPhone-b-1" style="margin-top:10px;">22</div>
</div>
</div>
<div class="clear"></div>
<div class="contentImg" style="background:url(static/img/longAD3.jpg)"></div>
<div class="contentUl">
<h2 class="fl">智能</h2>
<div class="fr">
<ul>
<li>熱門</li>
<li>電視影音</li>
<li>電腦</li>
<li>家居</li>
<li>電腦</li>
<li>家居</li>
</ul>
</div>
</div>
<div class="contentPhone">
<div class="contentPhone-a fl" style="margin-right:12.7px;background:url(static/img/buy/智能AD1.jpg)"></div>
<div class="contentPhone-b fl" style="margin-right:12.7px">
</div>
<div class="contentPhone-b fl" style="margin-right:12.7px"></div>
<div class="contentPhone-b fl" style="margin-right:12.7px"></div>
<div class="contentPhone-b fl"></div>
<div class="contentPhone-a fl" style="margin-right:12.7px;margin-top:12.7px;background:url(static/img/buy/智能AD2.jpg)"></div>
<div class="contentPhone-b fl" style="margin-right:12.7px;margin-top:12.7px;"></div>
<div class="contentPhone-b fl" style="margin-right:12.7px;margin-top:12.7px;"></div>
<div class="contentPhone-b fl" style="margin-right:12.7px;margin-top:12.7px;"></div>
<div class="contentPhone-b fl" style="margin-top:12.7px;">
<div class="contentPhone-b-1">11</div>
<div class="contentPhone-b-1" style="margin-top:10px;">22</div>
</div>
</div>
<div class="clear"></div>
<div class="contentImg" style="background:url(static/img/longAD4.jpg)"></div>
<div ></div>
</div>
</div>
<!-- 底部 -->
<div class="footer">
<div class="foot">
<div class="foot-top">
<a href="#"><i class="fa fa-wrench"></i>預(yù)約維修服務(wù)</a><span></span>
<a href="#"><i class="fa fa-rotate-right"></i>7天無理由退貨</a><span></span>
<a href="#"><i class="fa fa-refresh"></i>15天免費換貨</a><span></span>
<a href="#"><i class="fa fa-gift"></i>滿150元包郵</a><span></span>
<a href="#"><i class="fa fa-map-marker"></i>520余家售后網(wǎng)點</a>
</div>
<span class="separate"></span>
<!-- <div class="separate"></div> -->
<div class="foot-middle">
<dl>
<dt>幫助中心</dt>
<dd><a href="#">賬戶管理</a></dd>
<dd><a href="#">購物指南</a></dd>
<dd><a href="#">訂單操作</a></dd>
</dl>
<dl>
<dt>服務(wù)支持</dt>
<dd><a href="#">售后服務(wù)</a></dd>
<dd><a href="#">自助服務(wù)</a></dd>
<dd><a href="#">相關(guān)下載</a></dd>
</dl>
<dl>
<dt>線下門店</dt>
<dd><a href="#">小米之家</a></dd>
<dd><a href="#">服務(wù)網(wǎng)點</a></dd>
<dd><a href="#">授權(quán)體驗店</a></dd>
</dl>
<dl>
<dt>關(guān)于小米</dt>
<dd><a href="#">了解小米</a></dd>
<dd><a href="#">加入小米</a></dd>
<dd><a href="#">投資者關(guān)系</a></dd>
</dl>
<dl>
<dt>關(guān)注我們</dt>
<dd><a href="#">新浪微博</a></dd>
<dd><a href="#">官網(wǎng)微博</a></dd>
<dd><a href="#">聯(lián)系我們</a></dd>
</dl>
<dl>
<dt>特色服務(wù)</dt>
<dd><a href="#">F碼通道</a></dd>
<dd><a href="#">禮物碼</a></dd>
<dd><a href="#">防偽查詢</a></dd>
</dl>
<div class="connect">
<p class="tele">Feir-520-1314</p>
<p class="timer">周一至周日 8:00-18:00<br>僅收市話費</p>
<button><i class="fa fa-commenting"></i><span>聯(lián)系客服</span></button>
</div>
</div>
<div class="clear"></div>
<div class="foot-bottom">
<div class="foot-bottom-left fl">
<img src="static/img/footlogo.png">
</div>
<div class="foot-bottom-middle fl" style="margin:0 8px;">
<div class="foot-bottom-middle-a">
<ul>
<li>小米商城<span></span></li>
<li>MIUI<span></span></li>
<li>米家<span></span></li>
<li>米聊<span></span></li>
<li>多看<span></span></li>
<li>游戲<span></span></li>
<li>路由器<span></span></li>
<li>米粉卡<span></span></li>
<li>政企服務(wù)<span></span></li>
<li>小米天貓店<span></span></li>
<li>隱私政策<span></span></li>
<li>問題反饋<span></span></li>
<li>Select Region</li>
</ul>
</div>
<div class="foot-bottom-middle-b">
?mi.com 京ICP證110507號 京ICP備10046444號 京公網(wǎng)安備11010802020134號 京網(wǎng)文[2014]0059-0009號違法和不良信息舉報電話:185-0130-1238,本網(wǎng)站所列數(shù)據(jù),除特殊說明,所有數(shù)據(jù)均出自我司實驗室測試
</div>
</div>
<div class="foot-bottom-right fr">
<img src="static/img/footericon1.png">
<img src="static/img/footericon2.png">
<img src="static/img/footericon3.png">
<img src="static/img/footericon4.png">
<img src="static/img/footericon5.png">
</div>
<div class="clear"></div>
<div class="" style="line-height:15px;text-align:center;">
探索黑科技,小米為發(fā)燒而生!
</div>
</div>
</div>
</div>
</body>
</html>
Correcting teacher:天蓬老師Correction time:2019-05-27 09:35:11
Teacher's summary:你覺得作業(yè)中, 提交這么大段的代碼有意義嗎?
下次,記得, 只需要提交關(guān)鍵部分即可, 還有要配圖, 要配圖