问题如下。
1.banner区家用电器右边小图标不居中
2.logo区搜索框和搜索按钮怎么错开了
3.top右边导航栏的下拉菜单怎么在logo区的下面
*{margin:0;padding:0;font-size:16px;}
body{background:#f3f5f7;}
a{text-decoration: none;color:#000;display:inline-block;}
li{list-style: none;}
/*top区*/
.top a{margin-left:5px;line-height: 30px;}
.top a:hover,.top .right .tit p:hover{color:red;background: yellow;}
.top{width:800px;height:30px;margin:0 auto ;margin-top:10px;padding-bottom:10px;border-bottom: 1px solid #bbb}
.top .left{float:left;}
.top .right{float:right;}
.top .right img{line-height: 30px;}
.top .right .tit p{padding-left:5px;}
.top .right li,.nav li{float:left;list-style: none;line-height: 30px;cursor: pointer;}
.top .right .sub{background: #fff;display: none;z-index: 99999px;}
.top .right .tit>li:hover .sub{display: block;}
.top .right .sub li{clear:both;color:#000;padding:0 5px 5px 5px;}
.top .right .tit>li:hover{background: #fff; border: 1px solid #bbb;border-top:none;}
.top .right .tit .sub li:hover{background: yellow;color:#000;}
.top .left .login{color:red;}
/*登录页*/
.layer-mask{display:none;z-index:99;position: fixed;top:0;left:0;width: 100%;height:100%;background: #000;opacity:0.5;}
.layer-pop{display:none;padding:20px;position:fixed;top:0;left:0;right:0;bottom:0;margin:auto;width:284px;background: #fff;z-index:100;height:280px;}
.layer-pop .content .close:hover{background: color;}
.layer-pop .content p,.layer-pop .content input{width:280px;height:32px;margin-top:20px;}
.layer-pop .content .way a{background: #bbb;border-radius:18px; margin-left:15px;height:36px;width:36px; }
.layer-pop .content .way a:hover{background: green;}
.layer-pop .content .way{margin-left:40px;}
.layer-pop .content .tip{height:10px;}
.layer-pop .content .tip a{font-size:10px;}
.layer-pop .content .tip input{height:10px;width: 10px}
.layer-pop .content .tip .fpsw{position:absolute;right:25px;}
.layer-pop .content .btn{background: red;border: none;color:#fff;}
.layer-pop .content .ctop .active{border-bottom: 2px solid red;color: red;padding-bottom: 4px;}
.layer-pop .content .ctop .reg{margin-left:25px;margin-right:133px;}
.layer-pop .content .main{overflow: hidden;width:290px;height:248px;}
.error{color: red;font-size:12px;}
/*logo区*/
.logo{position:relative;font-size:16px;background: #f3f5f7;height:48px;width: 800px;margin:0 auto;margin-top:25px;margin-bottom:25px;}
.logo .logoimg,.logo .search{float:left;}
.logo .logoimg{width:200px;}
.logo .search{position:absolute;z-index:3px;right: 130px;}
.logo .search .txt{line-height:26px;font-size:14px;width:335px;}
.logo .search .sbtn{background: #000; height:30px;width:65px;border:none;color:#fff;}
.logo .shopcart{z-index:3px;right:0px;float:right;position:absolute;background: red;color:#fff;width:115px;height:30px;line-height: 30px;}
.logo .shopcart .cartimg,.iimg{vertical-align: middle;margin-top:-4px;}
.logo .shopcart:hover{color:red;background-color: #fff;cursor:pointer;}
.logo .shopcart:hover .drop{display: block;}
.logo .drop{display:none;background:#fff;position:absolute;width:262px;border: 1px solid #bbb;color: #000; }
.logo .dropmain{overflow: scroll;height:305px;}
.logo .drop p{padding: 10px 0 10px 15px}
.logo .goods{padding:10px 15px;border-top:1px solid #bbb;}
.logo .details{margin:0 10px;font-size:12px;}
.logo .goods:hover{background:#f3f5f7;color:red;}
.logo .goodsfoot .gtbtn{background: red;color:#fff;line-height:30px;width:80px;margin-left: 17px;border:none;}
.logo .goodsfoot{position:sticky;bottom:0;}
/*导航区*/
.nav{background: #000;width: 100%;height:30px;}
.nav ul{margin-left:395px;}
.nav li{color:#fff;margin-left:44px;}
.nav li:hover{color:red;background:#07111b;cursor: pointer; }
/*banner区*/
.banner{position: relative;width: 800px;margin:0 auto;}
.banner .classify{height:390px;color:#fff;position:relative;}
.banner .classify .ctit{line-height: 34px;position:absolute;top:-33px;background:rgba(255,0,0,0.6);width: 180px;}
.banner .classify .ctit img{vertical-align: middle;}
.banner .classify .subclassify:hover{background: #fff;color: red;}
.banner .classify .subclassify:hover .list2{display:block;}
.banner .classify .subclassify{background:red;font-size:12px;width: 173px;height:26px;line-height: 26px;padding-left: 7px;}
.banner .classify li img{float:right;margin-right:10px;transform: rotate(270deg);vertical-align:middle;}
.banner .classify .subclassify .list2{background:#fff;z-index:99;display:none;margin-left:5px;width:476px;color:#4D4D4D;font-size:12px;position: absolute;top: 0;left:180px;}
.banner .classify .subclassify .list2 span:first-child{color:#000;font-weight: bold;}
.banner .classify .subclassify .list2 span{font-size:12px;}
.banner .classify .subclassify .list2sub{height:60px;}
.banner .slide{position:absolute;top:5px;left:185px;width: 440px;height:308px;overflow: hidden;}
.banner .slide .simg{width: 440px;height:308px;background-repeat: no-repeat;overflow: hidden;background-size: 440px 308px}
.banner .slide .s1{background-image: url('../img/focus-carousel/1.jpg');}
.banner .slide .s2{background-image: url('../img/focus-carousel/2.jpg');}
.banner .slide .s3{background-image: url('../img/focus-carousel/3.jpg');}
.banner .slide .s4{background-image: url('../img/focus-carousel/4.jpg');}
.banner .slide .s5{background-image: url('../img/focus-carousel/5.jpg');}
.banner .slide .s6{background-image: url('../img/focus-carousel/6.jpg');}
.banner .slide .btn{margin-top:-30px;width: 40px;height:80px;position: absolute;top:50%;}
.banner .slide .pre{right:-12px;background: no-repeat url('../img/focus-carousel/pre.png');}
.banner .slide .pre2{left:10px;background: no-repeat url('../img/focus-carousel/pre2.png');}
.banner .slide .dots{position: absolute;bottom: 5px;right:5px;height: 16px;width: 85px;}
.banner .slide .dots span{border:1px solid #fff;background: grey;display: inline-block;cursor: pointer;border-radius:50%;height: 8px;width: 8px;}
.banner .slide .dots .active{border:1px solid grey;background:#fff ;}<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>综合</title> <link rel="stylesheet" href="../css/css.css"> <script src="http://cdn.bootcss.com/jquery/1.12.4/jquery.js"></script> <script src="../jquery/jquery.js"></script> </head> <body> <div id="top" class="top"> <div class="left"> <a href="#" class="login">亲，请登录</a> <a href="" class="reg">免费注册</a> <a href="" class="phone">手机逛慕淘</a> </div> <div class="right"> <ul class="tit"> <li ><p>我的慕淘<img src="../img/icon/22.png" alt=""></p> <ul class="sub"><li>购物车</li><li>我的商品</li><li>我的收藏夹</li></ul> </li> <li ><p>收藏夹<img src="../img/icon/22.png" alt=""></p> <ul class="sub"><li>我的收藏夹</li><li>购物车</li></ul> </li> <li ><p>商品分类<img src="../img/icon/22.png" alt=""></p> <ul class="sub"><li>购物车</li><li>已买的</li><li>我的收藏夹</li></ul> </li> <li ><p>卖家中心<img src="../img/icon/22.png" alt=""></p> <ul class="sub"><li>已买的</li><li>我的收藏夹</li></ul> </li> <li ><p>联系客服<img src="../img/icon/22.png" alt=""></p> <ul class="sub"><li>购物车</li><li>我的收藏夹</li><li>购物车</li><li>我的收藏夹</li></ul> </li> </ul></div> </div> <div id="logo" class="logo"> <div class="sublogo logoimg"><img src="../img/logo.png"></div> <div class="sublogo search"><input class="txt" type="text" name="" placeholder="你知道吗你呢"><input class="sbtn" type="submit" value="搜索" name=""></div> <div class="sublogo shopcart"><img class="cartimg" src="../img/icon/26.png"> 购物车 | 0 <img class="iimg" src="../img/icon/21.png"> <div class="drop"> <div class="dropmain"> <p>最新加入的商品</p> <div class="goods"><img src="../img/cart/1.png"><span class="details">asdai货款纠纷和辅导<br>￥355×1</span><img src="../img/icon/20.png"></div> <div class="goods"><img src="../img/cart/2.png"><span class="details">fhjfgjsfljhgxfhkjgkjk<br>￥35×5</span><img src="../img/icon/20.png"></div> <div class="goods"><img src="../img/cart/3.png"><span class="details">asdai货款纠纷和辅导<br>￥355×1</span><img src="../img/icon/20.png"></div> <div class="goods"><img src="../img/cart/4.png"><span class="details">asdai货款纠纷和辅导<br>￥355×1</span><img src="../img/icon/20.png"></div> <div class="goods"><img src="../img/cart/5.png"><span class="details">asdai货款纠纷和辅导<br>￥355×1</span><img src="../img/icon/20.png"></div> <div class="goods"><img src="../img/cart/4.png"><span class="details">asdai货款纠纷和辅导<br>￥355×1</span><img src="../img/icon/20.png"></div> <div class="goods"><img src="../img/cart/1.png"><span class="details">asdai货款纠纷和辅导<br>￥355×1</span><img src="../img/icon/20.png"></div> <div class="goods"><img src="../img/cart/3.png"><span class="details">asdai货款纠纷和辅导<br>￥355×1</span><img src="../img/icon/20.png"></div> <div class="goods"><img src="../img/cart/5.png"><span class="details">asdai货款纠纷和辅导<br>￥355×1</span><img src="../img/icon/20.png"></div> </div> <p class="goodsfoot">总计：13件 共0:0 <input class="gtbtn" type="submit" value="去购物车"></p> </div> </div> </div> <div id="nav" class="nav"> <ul> <li class="navtit"> 个人代表类</li> <li class="navtit"> 商分类</li> <li class="navtit"> 商品类</li> <li class="navtit"> 商品类</li> <li class="navtit"> 商品分类</li></ul> </div> <div id="banner" class="banner"> <div class="classify"> <p class="ctit"><img class="ctitimg" src="../img/icon/18.png">商品分类</p> <ul> <li class="subclassify">家用电器<img src="../img/icon/23.png"> <div class="list2"> <div class="list2sub"><span>家用电器 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 电脑 速度开始 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> </div> </li> <li class="subclassify">手机、数码<img src="../img/icon/23.png"><div class="list2"> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 电脑 速度开始 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> </div></li> <li class="subclassify">家用电器<img src="../img/icon/23.png"><div class="list2"> <div class="list2sub"><span>用电 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 电脑 速度开始 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> </div></li> <li class="subclassify">是否会<img src="../img/icon/23.png"><div class="list2"> <div class="list2sub"><span>通讯 </span> <span class="subcon">| 手机 电脑 速度开始手机 方法 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 电脑 速度开始 快速速度开始 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> </div></li> <li class="subclassify">女装、等价的、会<img src="../img/icon/23.png"><div class="list2"> <div class="list2sub"><span>手讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 电脑 速度开始 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> </div></li> <li class="subclassify">女装、等价的、是否会<img src="../img/icon/23.png"><div class="list2"> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手天天机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 电脑 速度开始 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 谷歌电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> </div></li> <li class="subclassify">家用电器<img src="../img/icon/23.png"><div class="list2"> <div class="list2sub"><span>手人人机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机人人通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手人机通讯 </span> <span class="subcon">| 手机 天天电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 电脑 速度开始 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> </div></li> <li class="subclassify">手机、 通话数码<img src="../img/icon/23.png"><div class="list2"> <div class="list2sub"><span>手人人机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 人手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 电脑 速度开始 快速</span></div> <div class="list2sub"><span>手机天天通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度人人开始手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> </div></li> <li class="subclassify">女装、等价的、是否会<img src="../img/icon/23.png"><div class="list2"> <div class="list2sub"><span>手机触发通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机嗯嗯通讯 </span> <span class="subcon">| 手机 手嗯嗯机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 电脑 速度开始 天天快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> </div></li> <li class="subclassify">家用电器<img src="../img/icon/23.png"><div class="list2"> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机问我通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 电脑 速度开始 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 方法手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> </div></li> <li class="subclassify">手机、数码<img src="../img/icon/23.png"><div class="list2"> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手问我机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 电脑 速度开始 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> </div></li> <li class="subclassify">女装、等价的、是否会<img src="../img/icon/23.png"><div class="list2"> <div class="list2sub"><span>手机问我任务通讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手等等机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 电脑 速度开始 快速</span></div> <div class="list2sub"><span>手机通问我讯 </span> <span class="subcon">| 手机 电脑 速度开始 发货 快速</span></div> <div class="list2sub"><span>手机通讯 </span> <span class="subcon">| 手机 手发射机 电脑 速度开始手机 电脑 速度开始电脑 速度开始 发货 快速</span></div> </div></li> </ul> </div> <div class="slide"> <div class="simg s1"></div> <div class="simg s2"></div> <div class="simg s3"></div> <div class="simg s4"></div> <div class="simg s5"></div> <div class="simg s6"></div> <a href="javascript:void(0)" class="btn pre2"></a> <a href="javascript:void(0)" class="btn pre"></a> <div class="dots"> <span class="active"></span> <span></span> <span></span> <span></span> <span></span> <span></span> </div> </div> <div class="service"></div> </div> <div id="table" class="table"></div> <div id="blogroll" class="blogroll"></div> <div id="foot" class="foot"></div> <!-- 弹出层遮罩--> <div class="layer-mask"></div> <!-- 弹出层窗体 --> <div class="layer-pop"> <div class="content"> <p class="ctop"> <a href="#" class="login active">登录</a> <a href="#" class="reg">注册</a> <a href="#" class="close"><img src="../img/icon/20.png" alt=""></a> </p> <div class="main"> <!-- 登录窗体 --> <div class="logincon"> <input id="username" class="username" name="username" type="text" placeholder="请输入登录邮箱/手机号"> <div class="error error-namemsg"></div> <input id="psw" name="password" class="psw" type="text" placeholder="6-16位密码，区分大小写，不能用空格"> <div class="error error-pswmsg"></div> <p class="tip"><input type="checkbox" checked><a href="">下次自动登录</a><a href="" class="fpsw">忘记密码</a></p> <input id="loginbtn" class="btn" type="submit" value="登 录"> <p class="way"> <a><img src="../img/icon/QQ.png" alt=""></a> <a><img src="../img/icon/weixin.png" alt=""></a> <a><img src="../img/icon/xinlang.png" alt=""></a> </p></div> <!-- 注册窗体 --> <div class="regcon"> <input type="text" class="regname" placeholder="输入注册邮箱/手机号" "> <div class="error error-regnamemsg"></div> <input type="text" class="vcode" placeholder="请输入验证码" style="width:150px;"> <img src="../img/verify.png" alt="" style="height:36px;position:absolute;right:25px;"> <div class="error error-vcodemsg"></div> <input id="regbtn" class="btn" type="submit" value="注 册"> <p class="way"> <a><img src="../img/icon/QQ.png" alt=""></a> <a><img src="../img/icon/weixin.png" alt=""></a> <a><img src="../img/icon/xinlang.png" alt=""></a> </p> </div> </div> </div> </div> </body> </html>
25
收起
正在回答
4回答
经过测试 ，问题描述如下：
商品分类图标去掉vertical-align: middle使其相对背景区域居中
2.搜索框与按钮设置如下使其保持一致
3.作业中设置z-index值不需要加px , 并且下拉菜单没有设置定位 ，所以会被logo区域设置过定位的 元素挡住 。如下修改：
完善一下吧 ， 祝学习愉快 ！
相似问题
登录后可查看更多问答，登录/注册
前端小白入门系列课程
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36713 个
从一个不会编程的小白到一个老司机是需要过程的，首先得入门，学习基础知识，然后才能进阶，最后再到精通，本专题是你走进前端世界的不二选择！
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星