小米商城的导航

Original 2019-02-09 22:03:47 362
abstract:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0">&

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<title>小米商城</title>

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>

<link rel="stylesheet" href="xiaomi/css/style01.css">

<link rel="stylesheet" href="layui/css/layui.css">


</head>

<body>

<header>

<div class="hc mc">

<div class="hc_l l" style="width:700px;">

<a href="" style="padding-left:0px;">小米商城</a>

<a href="">MIUI</a>

<a href="">loT</a>

<a href="">云服务</a>

<a href="">金融</a>

<a href="">有品</a>

<a href="">小爱开放平台</a>

<a href="">政企服务</a>

<a href="">资质证照</a>

<a href="">协议规则</a>

<a href="">下载app</a>

<a href="" style="border-right:none;">Select Region</a>

</div>

<div class="hc_r r" style="width:280px;">

<a href="xiaomilogin/html">登录</a>

<a href="">注册</a>

<a href="">消息通知</a>                

<a href="" style="width:100px;border-right:none;background:#424242;"><span class="layui-icon layui-icon-cart"></span>购物车(0)</a>

</div>

<div class="clear"></div>

</div>

</header>


<main>      

<div class="mcontentup mc">

<div class="mcheader" style="margin-top:24px;">

<div class="mch_l l"><a href="#"><img src="xiaomi/images/logo.png"></a></div>

<div class="mch_m">

<a name="imga" onmouseover="fa(this)" onmouseleave="fa1(this)" href="">小米手机</a>

<div class="mch_img" name="imgi">

<div class="mch_imgbox">

<p class="xp">新品</p>

<a href=""><img src="xiaomi/images/t0mix3.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/t01qingchun.png"></a>

<p><a href="">小米8 青春版</a></p>

<p class="jg">1399元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/t02mi8.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<p class="xp">新品</p>

<a href=""><img src="xiaomi/images/t03miplay.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/t04mi8se.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

</div>        

<a name="imga" onmouseover="fa(this)" onmouseleave="fa1(this)" href="">红米</a>

<div class="mch_img" name="imgi">

<div class="mch_imgbox">

<p class="xp">新品</p>

<a href=""><img src="xiaomi/images/hm1.png"></a>

<p><a href="">红米Note 7</a></p>

<p class="jg">999元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/hm2.png"></a>

<p><a href="">小米8 青春版</a></p>

<p class="jg">1399元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/hm3.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<p class="xp">新品</p>

<a href=""><img src="xiaomi/images/hm4.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/hm5.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

</div>

<a name="imga" onmouseover="fa(this)" onmouseleave="fa1(this)" href="">电视</a>

<div class="mch_img" name="imgi">

<div class="mch_imgbox">

<p class="xp">新品</p>

<a href=""><img src="xiaomi/images/hm1.png"></a>

<p><a href="">小米电视4S 75英寸</a></p>

<p class="jg">7999元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/hm2.png"></a>

<p><a href="">小米8 青春版</a></p>

<p class="jg">1399元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/hm3.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<p class="xp">新品</p>

<a href=""><img src="xiaomi/images/hm4.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/hm5.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

</div>

<a name="imga" href="">笔记本</a>

<a name="imga" href="">家电</a>

<a name="imga" href="">新品</a>

<a name="imga" href="">路由器</a>

<a name="imga" href="">智能硬件</a>

<a name="imga" href="">服务</a>

<a name="imga" href="">社区</a>

</div>

<div class="mch_r r" style="width:292px;height:50px;border:1px solid #e0e0e0;">

<input type="text" placeholder="小米8 小米MIX 2S" style="width:242px;height:50px;border:1px solid #e0e0e0;">&nbsp;&nbsp;

<span class="layui-icon layui-icon-search" style="font-size:18px;font-weight:bold;"></span>

</div>                

</div>

<div class="clear"></div>

<div style="margin-top:24px;">

<div class="mcnav_l l">

<a onmouseover="fa(this)" onmouseleave="fa1(this)" href="">手机 电话卡 <span class="layui-icon layui-icon-right"></span></a>

<div class="mcnav_box" >

<div class="mcnav_imgbox">

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

</div>  

<div class="mcnav_imgbox">

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

</div>                                  

</div>

<a onmouseover="fa(this)" onmouseleave="fa1(this)" href="">电视 盒子 <span class="layui-icon layui-icon-right"></span></a>

<div class="mcnav_box" >

<div class="mcnav_imgbox">

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

</div>  

<div class="mcnav_imgbox">

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

</div>                                  

</div>

<a href="">笔记本 平板 <span class="layui-icon layui-icon-right"></span></a>

<a href="">家电 插线板 <span class="layui-icon layui-icon-right"></span></a>

<a href="">出行 穿戴 <span class="layui-icon layui-icon-right"></span></a>

<a href="">智能 路由器 <span class="layui-icon layui-icon-right"></span></a>

<a href="">电源 配件 <span class="layui-icon layui-icon-right"></span></a>

<a href="">健康 儿童 <span class="layui-icon layui-icon-right"></span></a>

<a href="">耳机 音箱 <span class="layui-icon layui-icon-right"></span></a>

<a href="">生活 箱包 <span class="layui-icon layui-icon-right"></span></a>

</div>

<div class="mcnav_r r" id="slideShowContainer">

<ul id="picUl">

<li><a href="#"><img src="xiaomi/images/xmad_11.jpg" alt=""/></a></li>

<li><a href="#"><img src="xiaomi/images/xmad_12.jpg" alt=""/></a></li>

<li><a href="#"><img src="xiaomi/images/xmad_13.jpg" alt=""/></a></li>

<li><a href="#"><img src="xiaomi/images/xmad_14.jpg" alt=""/></a></li>

</ul>

<ul id="dotUl">

<li class="selected">1</li>

<li class="unselected">2</li>

<li class="unselected">3</li>

<li class="unselected">4</li>

</ul>

</div>

</div>

<div class="clear"></div>

<div style="margin-top:15px;">

<div class="mcnav-zx">

<div style="border-bottom: 1px solid gray;">

<a href=""><i class="layui-icon layui-icon-cellphone"></i>选购手机</a>

<a href=""><i class="layui-icon layui-icon-cellphone"></i>企业团购</a>

<a href="" style="border:none;"><i class="layui-icon layui-icon-cellphone"></i>F码通道</a>

</div>

<div>

<a href=""><i class="layui-icon layui-icon-cellphone"></i>米粉卡</a>

<a href=""><i class="layui-icon layui-icon-cellphone"></i>以旧换新</a>

<a href="" style="border:none;"><i class="layui-icon layui-icon-cellphone"></i>话费充值</a>

</div>

</div>

<a href="" style="margin-left:9px;"><img src="xiaomi/images/xmad_111.jpg" class="img32"></a>

<a href="" style="margin-left:8px;"><img src="xiaomi/images/xmad_112.jpg" class="img32"></a>

<a href="" style="margin-left:8px;"><img src="xiaomi/images/xmad_113.jpg" class="img32"></a>

</div>

<div class="clear"></div>

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">小米闪购</h2>

<p style="width:75px;float:right;"><i class="layui-icon layui-icon-left"></i><i class="layui-icon layui-icon-right"></i></p>

</div>

<div class="img40" style="background-color:#F1EDED;border-top:1px solid red;">

<br>

<p style="font-size:20px;color:red;text-align: center;margin:30px 0;">10:00 场</p>

<p style="text-align: center;"><img src="xiaomi/images/xmsg.png"></p>

<p style="font-size:14px;color:gray;text-align: center;margin:30px 0;">距离结束还有</p>

<p style="width:200px;padding:0px 15px;"><span class="sfm">00</span><span class="sfm">00</span><span class="sfm">00</span></p>

</div>

<div class="img40" style="border-top:1px solid #ff6700;margin-left:13px;">

<a href=""><img class="img41" src="xiaomi/images/xmsg1.jpg"></a>

</div>

<div class="img40" style="border-top:1px solid green;margin-left:13px;">

<a href=""><img class="img41" src="xiaomi/images/xmsg2.jpg"></a>

</div>

<div class="img40" style="border-top:1px solid blue;margin-left:13px;">

<a href=""><img class="img41" src="xiaomi/images/xmsg3.jpg"></a>

</div>

<div class="img40" style="border-top:1px solid red;margin-left:13px;">

<a href=""><img class="img41" src="xiaomi/images/xmsg4.jpg"></a>

</div>              

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/01sj.jpg" class="img1"></a></div>

</div>

</div>


<div class="clear"></div>          

<div style="width:100%;background-color:#f5f5f5; margin-top:35px;">

<div class="mcontentdown mc">  

<div>

<div class="xbt">

<h2 style="float:left;">手机</h2>

<p style="width:80px;float:right;"><span id="span1">查看全部</span><i id="icon1" class="layui-icon layui-icon-right"></i></p>

</div>

<a href=""><img class="img51" src="xiaomi/images/sj0.jpg"></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/02dsj.jpg" class="img1"></a></div>

<div class="clear"></div>          

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">家电</h2>

<p style="width:auto;float:right;">

<span class="span2">热门</span>

<span class="span2">电视影音</span>

<span class="span2">电脑</span>

<span class="span2">家居</span></p>

</div>

<a href=""><img class="img52" src="xiaomi/images/jd0.jpg"></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src="xiaomi/images/jd01.jpg"></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img60" src=""></a>

<a href=""><img class="img60" src=""></a>    

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/03yx.jpg" class="img1"></a></div>

<div class="clear"></div>          

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">智能</h2>

<p style="width:auto;float:right;">

<span class="span2">热门</span>

<span class="span2">出行</span>

<span class="span2">健康</span>

<span class="span2">酷玩</span>

<span class="span2">路由器</span>

</p>

</div>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img60" src=""></a>

<a href=""><img class="img60" src=""></a>  

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/04b.jpg" class="img1"></a> </div>

<div class="clear"></div>          

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">搭配</h2>

<p style="width:auto;float:right;">

<span class="span2">热门</span>

<span class="span2">耳机</span>

<span class="span2">音箱</span>

<span class="span2">电源</span>

<span class="span2">电池存储卡</span>

</p>

</div>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img60" src=""></a>

<a href=""><img class="img60" src=""></a>  

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/05dlq.jpg" class="img1"></a> </div>

<div class="clear"></div>          

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">配件</h2>

<p style="width:auto;float:right;">

<span class="span2">热门</span>

<span class="span2">保护套</span>

<span class="span2">贴膜</span>

<span class="span2">其它配件</span>

</p>

</div>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img60" src=""></a>

<a href=""><img class="img60" src=""></a>  

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/06lyej.jpg" class="img1"></a> </div>

<div class="clear"></div>          

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">周边</h2>

<p style="width:auto;float:right;">

<span class="span2">热门</span>

<span class="span2">出行</span>

<span class="span2">居家</span>

<span class="span2">生活周边</span>

<span class="span2">箱包</span>

</p>

</div>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img60" src=""></a>

<a href=""><img class="img60" src=""></a>  

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/07ms.jpg" class="img1"></a> </div>

<div class="clear"></div>

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">为你推荐</h2>

<p style="width:75px;float:right;"><i class="layui-icon layui-icon-left"></i><i class="layui-icon layui-icon-right"></i></p>

</div>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

</div>

<div class="clear"></div>

<div>

<p>热评产品</p>

<a href=""><img class="img70" src=""></a>

<a href=""><img class="img70" src=""></a>

<a href=""><img class="img70" src=""></a>

<a href=""><img class="img70" src=""></a>

<a href=""><img class="img71" src=""></a>

<a href=""><img class="img71" src=""></a>

<a href=""><img class="img71" src=""></a>

<a href=""><img class="img71" src=""></a>

</div>

<div class="clear"></div>

<div>

<p>内容</p>

<a href=""><img class="img80" src=""></a>

<a href=""><img class="img80" src=""></a>

<a href=""><img class="img80" src=""></a>

<a href=""><img class="img80" src=""></a>

</div>

<div class="clear"></div>

<div>

<p>视频</p>

<a href=""><img class="img90" src=""></a>

<a href=""><img class="img90" src=""></a>

<a href=""><img class="img90" src=""></a>

<a href=""><img class="img90" src=""></a>

</div>

<div class="clear"></div>

</div>

</main>

<footer>

<div class="fcontent" style="background-color:#fff;">

<div class="ftnav mc">

<a href=""><span class=""></span>预约维修服务</a>

<a href=""><span class=""></span>7天无理由退货</a>

<a href=""><span class=""></span>15天免费换货</a>

<a href=""><span class=""></span>满150元包邮</a>

<a href="" style="border-right:none;"><span class=""></span>520余家售后网点</a>

</div>

<div class="ftc mc">

<div class="ftc_l l">

<div><p>帮助中心</p> <p>服务支持</p><p>线下门店</p><p>关于小米</p><p>关注我们</p><p>特色服务</p></div>                    

<div>

<a href="">账户管理</a>

<a href="">售后政策</a>

<a href="">小米之家</a>

<a href="">了解小米</a>

<a href="">新浪微博</a>

<a href="">F码通道</a>

<a href="">购物指南</a>

<a href="">自助服务</a>

<a href="">服务网点</a>

<a href="">加入小米</a>

<a href="">官方微信</a>

<a href="">礼物码</a>

<a href="">订单操作</a>

<a href="">相关下载</a>

<a href="">授权体验店</a>

<a href="">投资者</a>

<a href="">联系我们</a>

<a href="">防伪查询</a>

</div>

</div>                    

<div class="ftc_r r">

<p style="font-size:20px;color:#ff5700;margin-bottom: 5px;">400-100-5678</p>

<p style="font-size:8px;margin-bottom: 5px;">周一至周日8:00-18:00</p>

<p style="font-size:8px;margin-bottom: 5px;">(仅收市话费)</p><br>

<button class="btfoot">联系客服</button>

</div>                

</div>        

</div>

<div class="ftft mc" style="padding-top:30px;">

<img src="xiaomi/images/logo.png" class="l" style="padding-right:5px;">

<a href="">小米商城</a>&nbsp;|

<a href="">MIUI</a>&nbsp;|

<a href="">米家</a>&nbsp;|

<a href="">米聊</a>&nbsp;|

<a href="">多看</a>&nbsp;|

<a href="">游戏</a>&nbsp;|

<a href="">路由器</a>&nbsp;|

<a href="">米粉卡</a>&nbsp;|

<a href="">政企服务</a>&nbsp;|

<a href="">小米天猫店</a>&nbsp;|

<a href="">隐私政策</a>&nbsp;|

<a href="">商城用户协议</a>&nbsp;|

<a href="">账号协议</a>&nbsp;|

<a href="">问题反馈</a>&nbsp;|

<a href="">廉正举报</a>&nbsp;|

<a href="">诚信合规</a>&nbsp;|

<a href="">Select Region</a>            

<br/>© <span>mi.com</span> 京ICP证110507号 <span>京ICP备10046444号</span> <span>京公网安备11010802020134号</span> <span>京网文[2017]1530-131号</span>

<br/><span>(京)网械平台备字(2018)第00005号</span> <span>互联网药品信息服务资格证 (京) -非经营性-2014-0090</span> <span>营业执照</span> <span>医疗器械公告</span>

<br/><span>增值电信业务许可证</span>  网络食品经营备案(京)【2018】WLSPJYBAHF-12   <span>食品经营许可证</span>

<br/>违法和不良信息举报电话:185-0130-1238 <span>知识产权侵权投诉</span> 本网站所列数据,除特殊说明,所有数据均出自我司实验室测试


</div>

</footer>


<script>

//通过js控制,动态修改相应的样式,达到图片轮播的效果

/*图片轮播*/

var slideShowContainer = document.getElementById("slideShowContainer");

var pic = document.getElementById("picUl").getElementsByTagName("li");

var dot = document.getElementById("dotUl").getElementsByTagName("li");

var index = 0;

var timer = null;

/*定义图片切换函数*/

function changePic (curIndex) {

for(var i = 0;i < pic.length;++i){

pic[i].style.display = "none";

dot[i].className = "unselected";

}

pic[curIndex].style.display = "block";

dot[curIndex].className = "selected";

}

/*index超出图片总量时归零*/

function autoPlay(){

if(+index >= pic.length){

index = 0;

}

changePic(index);

index++;

}

/*定义并调用自动播放函数*/

timer = setInterval(autoPlay,1500);

/*鼠标划过整个容器时停止自动播放*/

slideShowContainer.onmouseover = function(){

clearInterval(timer);

}

/*鼠标离开整个容器时继续播放下一张*/

slideShowContainer.onmouseout = function(){

timer = setInterval(autoPlay,1500);

}

/*遍历所有数字导航实现划过切换至对应的图片*/

for(var i = 0;i < dot.length;i++){

dot[i].onmouseover = function(){

clearInterval(timer);

index = this.innerText-1;

changePic(index)

}

}


//顶部导航条下拉图片框,左侧导航栏右拉图片框 移上显示、移出隐藏

function fa(ele){

ele.nextElementSibling.style.display='block';

}

function fa1(ele){

ele.nextElementSibling.style.display='none';

}


</script>

</body>

</html>



*{margin:0px;padding:0px;}

.mc{margin:0px auto;width:1226px;}

.mt{margin-top:10px;}

.mbt{margin-bottom:10px;}

.l{float:left;}

.r{float:right;}

.clear{clear:both;}

a{text-decoration: none;text-align: center;}


/* 头部 */

header{width:100%;height:40px;background-color:#333;}

header a{text-decoration: none;border-right:1px solid #423B36;float:left;padding:0px 7px;color:#b0b0b0;}

header a:hover{color:white;}

.hc{width:1226px;height:30px;text-align: center;line-height: 16px;padding:12px 0px;font-size:12px;}


.mcontentup{background-color:#fff;}

main a{float:left;text-decoration: none;text-align: center;color:#333;}

/* 主体顶部导航条 */

.mch_l{width:230px;}

.mch_m>a{font-size:16px;line-height: 56px;padding:0px 10px;}

.mch_m>a:hover{color:#ff5700;}

.mch_r{width:300px;height:54px;background-color:#fff;}

.mch_img{display:none;width:100%;height:230px;background-color:#fff;border-top:1px solid #e0e0e0;

border-bottom:1px solid #e0e0e0;text-align: center;position: absolut

Correcting teacher:韦小宝Correction time:2019-02-11 10:23:21
Teacher's summary:不错不错 写的很完整!代码写的也很规范!像这种有外部引入的样式或者js可以截图放上来哦!

Release Notes

Popular Entries