abstract：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>小米商城</title> </head> <link rel="stylesheet" type=&quo
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>小米商城</title> </head> <link rel="stylesheet" type="text/css" href="css/main.css"> <link rel="stylesheet" type="text/css" href="../font-awesome/css/font-awesome.min.css"> <body> <div class="top"> <div class="topmain"> <ul class="topmaincontent"> <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="#">云服务</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="#">企业服务</a><span>|</span></li> <li><a href="#">SelectRegion</a></li> </ul> <div class="topmaincontent_right"> <!-- <ul> <ul style=" margin-top: 0px; padding-top: 0px;"> <li style="height: 40px; margin-top: 0px; padding-top: 0px;">dd</li> </ul> --> <ul style="margin-top: 0px; padding-top: 0px;"> <li><a href="#">登录</a><span>|</span></li> <li><a href="#">注册</a><span>|</span></li> <li><a href="shop/order.html">我的订单 </a></li> <li class="header_right_li"><a href="shop/cart.html"><i class="fa fa-shopping-cart" ></i> 购物车 ( 0 )</a> <div>购物车中还没有商品，赶紧选购吧！</div> </li> </ul> </div> </div> </div> <div class="clear"></div> <div class = "topmenu"> <div class="box" style="width: 1226px;margin: 0 auto;"> <!-- 这个居中div --> <div class="topmenu_s"> <!-- 小米logo 和年货节gif --> <img src="img/footlogo.png"> <img src="img/nianhuojie.gif"> </div> <div class="topmenu_s1"> <!-- nav --> <ul> <li class="miphonemainli"><a href="#" >小米手机</a> <div class="miphone"> <div class = "miphone_in_main" > <div class="miphonein"> <div class="miphone_new"> <span class ="newitem">新品</span> </div> <img src="img/mix3-320.png"> </div> <span class = "spinv"></span> <div class="miphonein"> <div class="miphone_new"></div> <img src="img/qingchun-320.png"> </div> <span class = "spinv"></span> <div class="miphonein"> <div class="miphone_new"></div> <img src="img/pc-320-220-mi8.png"> </div> <span class = "spinv"></span> <div class="miphonein"> <div class="miphone_new"> <span class ="newitem">新品</span> </div> <img src="img/pc-320-miplay-1.png"> </div> <span class = "spinv"></span> <div class="miphonein"> <div class="miphone_new"></div> <img src="img/pc-320-220-mi8se.png"> </div> </div> </div> </li> <li class="redmiphonemainli"><a href="#">红米</a> <div class="redmiphone"> <div class = "miphone_in_main" > <div class="miphonein"> <div class="miphone_new"> <span >新品</span> </div> <img src="img/note7320-220.png"> </div> <span class = "spinv"></span> <div class="miphonein"> <div class="miphone_new"></div> <img src="img/6pro320-220.png"> </div> <span class = "spinv"></span> <div class="miphonein"> <div class="miphone_new"></div> <img src="img/666320.png"> </div> <span class = "spinv"></span> <div class="miphonein"> <div class="miphone_new"> <span >新品</span> </div> <img src="img/6A320.png"> </div> <span class = "spinv"></span> <div class="miphonein"> <div class="miphone_new"></div> <img src="img/note5-320-220.png"> </div> </div> </div> </li> <li class="tvmainli"><a href="#">电视</a> <div class="tv"> <div class = "miphone_in_main" > <div class="miphonein"> <div class="miphone_new"> <span >新品</span> </div> <img src="img/4s75.png"> </div> <div class="miphonein"> <div class="miphone_new"></div> <img src="img/32.png"> </div> <div class="miphonein"> <div class="miphone_new"></div> <img src="img/4a43.png"> </div> <div class="miphonein"> <div class="miphone_new"> <span >新品</span> </div> <img src="img/50.png"> </div> <div class="miphonein"> <div class="miphone_new"></div> <img src="img/4A-55.jpg"> </div> <div class="miphonein"> <div class="miphone_new"></div> <img src="img/475toutu.png"> </div> </div> </div> </li> <li><a href="#">笔记本</a></li> <li><a href="#">新品</a></li> <li><a href="#">路由器</a></li> <li><a href="#">智能硬件</a></li> <li><a href="#">社区</a></li> </ul> </div> <di class="topmenu_s_r"> <!-- 右边新品等 --> <form> <input type="text" class="finnew" name=""> <div class="contentMenu_form_a"> <a href="">电视新品</a> <a href="">618预热</a> </div> <div class="btsearch"><i class="fa fa-search"></i> </div> </form> </div> </div> </div> <div class="clear"></div> <div class = "topcontent1"> <div class="topcontent1_l"> <ul class="content_pic_ul"> <li class = "content_pic_phone"><a href="">手机 电话卡 </a><i class="fa fa-angle-right"></i> <div class="contentPic_l_menu"> <div class="vmenue"> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/mix3-80.png"></div> <div class="vmenueitem_0"><a href="">小米Mix3</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/qingchun-80.png"></div> <div class="vmenueitem_0"><a href="">小米8亲春版</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/pingmu-80.png"></div> <div class="vmenueitem_0"><a href="">小米8屏幕指纹版</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/m8-80.png"></div> <div class="vmenueitem_0"><a href="">小米8</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/m8se-80.png"></div> <div class="vmenueitem_0"><a href="">小米8SE</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/mix2s80-80white.png"></div> <div class="vmenueitem_0"><a href="">小米Mix2S</a></div> </div> </div> <div class="vmenue1"> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/max3-80-80.png"></div> <div class="vmenueitem_0"><a href="">小米Max3</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/qingchun-80.png"></div> <div class="vmenueitem_0"><a href="">小米8亲春版</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/pingmu-80.png"></div> <div class="vmenueitem_0"><a href="">小米8屏幕指纹版</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/m8-80.png"></div> <div class="vmenueitem_0"><a href="">小米8</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/m8se-80.png"></div> <div class="vmenueitem_0"><a href="">小米8SE</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/mix2s80-80white.png"></div> <div class="vmenueitem_0"><a href="">小米Mix2S</a></div> </div> </div> <div class="vmenue2"> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/666666.png"></div> <div class="vmenueitem_0"><a href="">红迷6</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/qingchun-80.png"></div> <div class="vmenueitem_0"><a href="">小米8亲春版</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/pingmu-80.png"></div> <div class="vmenueitem_0"><a href="">小米8屏幕指纹版</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/m8-80.png"></div> <div class="vmenueitem_0"><a href="">小米8</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/m8se-80.png"></div> <div class="vmenueitem_0"><a href="">小米8SE</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/mix2s80-80white.png"></div> <div class="vmenueitem_0"><a href="">小米Mix2S</a></div> </div> </div> <div class="vmenue3"> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/mimobile.jpg"></div> <div class="vmenueitem_0"><a href="">小米移动电话卡</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/qingchun-80.png"></div> <div class="vmenueitem_0"><a href="">小米8亲春版</a></div> </div> <div class="clear"></div> <div class="vmenueitem"> <div class="vmenueitem_0"><img src="img/yunfuwu.jpg"></div> <div class="vmenueitem_0"><a href="">云服务物</a></div> </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> <div class="contentPic_l_menu"> </div> </li> <li><a href="">生活 米兔</a> <i class="fa fa-angle-right"></i></li> </ul> </div> <div class="topcontent1_r"> </div> </div> <div class="clear"></div> <div class = "topcontent2"> <div class="topcontent2_s1"> <ul> <li style="margin-right: 12.7px;"><span class="fa fa-mobile-phone fa-2x"></span>选购手机</li> <li style="margin-right: 12.7px;"><span class="fa fa-gift fa-2x"></span>企业团购</li> <li><span class="fa fa-facebook fa-2x"></span>F码通道</li> <li style="margin-right: 12.7px;"><span class="fa fa-file-text fa-2x"></span>米粉卡</li> <li style="margin-right: 12.7px;"><span class="fa fa-refresh fa-2x"></span>以旧换新</li> <li><span class="fa fa-credit-card fa-2x"></span>话费充值</li> </ul> </div> <div class="topcontent2_s2" style="background: url(img/c22.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%; "> </div> <div class="topcontent2_s2" style="background: url(img/c22.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class="topcontent2_s2" style="background: url(img/c23.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> </div> <div class="clear"></div> <div class = "topcontentflashshop"> <h2>小米闪购</h2> <div class="topcontentflashshop_1" style="margin-right: 12px; border-top: 2px solid green;"></div> <div class="topcontentflashshop_1" style="margin-right: 12px; border-top: 2px solid #FFAC13;"></div> <div class="topcontentflashshop_1" style="margin-right: 12px; border-top: 2px solid red;"></div> <div class="topcontentflashshop_1" style="margin-right: 12px; border-top: 2px solid #E53935;"></div> <div class="topcontentflashshop_1" style="border-top: 2px solid blue;"></div> </div> <div class="clear"></div> <div class = "topcontentad" style="background: url(img/ad1.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%; margin-top: 40px;"> </div> <div class = "topcontentphone"> <h2>手机</h2> <div class="phonemore">查看更多 <span> <i class="fa fa-angle-right"></i> </div> <div class="clear"></div> <div class="topcontentphone_l"> </div> <div class="topcontentphone_r"> <div class="topcontentphone_r_top"> <div class="topcontentphone_r_top_s1" style="margin-right: 10px; background: url(img/phonert1.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class="topcontentphone_r_top_s1" style="margin-right: 10px; background: url(img/phonert2.png); background-size: 100% 100%; -moz-background-size: 100% 100%; "> </div> <div class="topcontentphone_r_top_s1" style="margin-right: 10px; background: url(img/phonert3.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class="topcontentphone_r_top_s1" style="margin-right: 10px; background: url(img/phonert4.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> </div> <div class="topcontentphone_r_top" style="margin-top: 20px;"> <div class="topcontentphone_r_top_s1" style="margin-right: 10px; background: url(img/phonert5.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class="topcontentphone_r_top_s1" style="margin-right: 10px; background: url(img/phonert6.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%; "> </div> <div class="topcontentphone_r_top_s1" style="margin-right: 10px; background: url(img/phonert7.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class="topcontentphone_r_top_s1" style="margin-right: 10px; background: url(img/phonert8.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> </div> </div> </div> <div class="clear"></div> <div class = "topcontentad" style="background: url(img/ad2.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%; margin-top: 40px;"> </div> <div class = "topcontentapplication"> <h2>家电</h2> <div class="topcontentapplication_sub"> <div class="topcontentapplication_sub_s1" style="background: url(img/app1.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class="topcontentapplication_sub_s1" style="background: url(img/app2.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class="topcontentapplication_sub_s1" style="background: url(img/app3.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class="topcontentapplication_sub_s1" style="background: url(img/app4.png); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class="topcontentapplication_sub_s1" style="background: url(img/app5.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> </div> <div class="topcontentapplication_sub"> <div class="topcontentapplication_sub_s1" style="background: url(img/app6.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;margin-top: 30px;"> </div> <div class="topcontentapplication_sub_s1" style="background: url(img/app7.png); background-size: 100% 100%; -moz-background-size: 100% 100%;margin-top: 30px;"> </div> <div class="topcontentapplication_sub_s1" style="background: url(img/app8.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;margin-top: 30px;"> </div> <div class="topcontentapplication_sub_s1" style="background: url(img/app9.png); background-size: 100% 100%; -moz-background-size: 100% 100%;margin-top: 30px;"> </div> <div class="topcontentapplication_sub_s1" style="background: url(img/app10.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;margin-top: 30px;"> </div> </div> </div> <div class="clear"></div> <div class = "topcontentad" style="background: url(img/ad3.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%; margin-top: 40px;"> </div> <div class = "topcontentsmart"> <div class="topcontentsmartheadl"> 智能 </div> <div class="topcontentsmartheadr"> <span>热门</span> <span>出行</span> <span>健康</span> <span>酷玩</span> <span>陆游器</span> </div> </div> <div class = "topcontentad" style="background: url(img/ad4.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class = "topcontentother"> 搭配 </div> <div class = "topcontentad" style="background: url(img/ad5.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class = "topcontentaccesorries"> 配件 </div> <div class = "topcontentad" style="background: url(img/ad6.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class = "topcontentother1"> 周边 </div> <div class = "topcontentad" style="background: url(img/ad7.jpg); background-size: 100% 100%; -moz-background-size: 100% 100%;"> </div> <div class = "topcontentrecommend"> 为你推荐 </div> <div class = "topcontentrecommend1"> 热评产品 </div> <div class = "contentcon"> 内容 </div> <div class = "contentvideo"> 视频 </div> <div class="footer"> <div class="footertop"> <a href="#"><i class="fa fa-wrench"></i>预约维修服务</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余家售后网点</a> </div> <div class="footertopline"></div> <div class="footer1bot"> <div class="footer1bots"> <ul class="footer1bot_ul"> <li class="footer1botliheader">帮助中心</li> <li><a href="#" >账户管理</a></li> <li><a href="#" >购物指南</a></li> <li><a href="#" >订单操作</a></li> </ul> </div> <div class="footer1bots"> <ul> <li class="footer1botliheader">服务支持</li> <li><a href="#" >售后政策</a></li> <li><a href="#" >自助服务</a></li> <li><a href="#" >相关下载</a></li> </ul> </div> <div class="footer1bots"> <ul> <li class="footer1botliheader">线下门店</li> <li><a href="#" >小米之家</a></li> <li><a href="#" >服务网点</a></li> <li><a href="#" >授权体验店</a></li> </ul> </div> <div class="footer1bots"> <ul> <li class="footer1botliheader">关于小米</li> <li><a href="#" >了解小米</a></li> <li><a href="#" >加入小米</a></li> <li><a href="#" >投资者关系</a></li> </ul> </div> <div class="footer1bots"> <ul> <li class="footer1botliheader">关注我们</li> <li><a href="#" >新浪微博</a></li> <li><a href="#" >官方微信</a></li> <li><a href="#" >联系我们</a></li> </ul> </div> <div class="footer1bots"> <ul> <li class="footer1botliheader">特色服务</li> <li><a href="#" >F 码通道</a></li> <li><a href="#" >礼物码</a></li> <li><a href="#" >防伪查询</a></li> </ul> </div> <div class="footer1bots_e"> <span class="tel">400-100-5678</span> <span class="teldes">周一至周日 8:00-18:00<br> （仅收市话费）</span> <button><span class="fa fa-commenting "></span> 联系客服</button> </div> </div> <!-- 最下面 --> <div class="clear"></div> <div class="footer1bots_ef"> <div class="footer1bots_efs" style="margin-right: 10px; padding-top: 20px;""> <img src = "img/footlogo.png"> </div> <div class="footer1bots_efs"> <ul style="padding-left: 0px;"> <li><a href="#">小米商城</a></li><div></div> <li><a href="#">MIUI</a></li><div></div> <li><a href="#">米家</a></li><div></div> <li><a href="#">米聊</a></li><div></div> <li><a href="#">多看</a></li><div></div> <li><a href="#">游戏</a></li><div></div> <li><a href="#">路由器</a></li><div></div> <li><a href="#">米粉卡</a></li><div></div> <li><a href="#">政企服务</a></li><div></div> <li><a href="#">小米天猫店</a></li><div></div> <li><a href="#"&amCorrecting teacher：查无此人Correction time：2019-01-15 18:03:50
Teacher's summary：做的不错，不过内容太多，作业显示不完成。继续加油