这几天做了首页中部部分，其中轮播图要用到JS知识，现在只用CSS放上了一张静态图，等暑假学了JS再完善上去。
效果图↓
左部菜单栏也没来的写，工作量太大了，有时间再补上吧。
html↓
<div class="top">
<div class="blocked"></div>
<div class="top-left">
<div class="top-left wangzhandaohang">
<a href="#" class="top-line">
<span class="top-span">网站导航</span>
<em class="point">∨</em>
</a>
<div class="wangzhandaohangson">
<dl class="wzdhson-list">
<dt class="list-dt">特色购物</dt>
<dd>
<p class="list-p"><a href="https://10035.suning.com/" class="list-link">苏宁互联</a></p>
<p class="list-p"><a href="https://dr.suning.com/" class="list-link">苏宁达人</a></p>
<p class="list-p"><a href="https://ka.suning.com/" class="list-link">苏宁卡</a></p>
<p class="list-p"><a href="https://g.suning.com/" class="list-link">苏宁国际</a></p>
<p class="list-p"><a href="https://hx.suning.com/" class="list-link">易回收</a></p>
<p class="list-p"><a href="https://2.suning.com/" class="list-link">二手优品</a></p>
<p class="list-p"><a href="https://quan.suning.com/lq_1.htm#classId=1"
class="list-link">领券中心</a></p>
<p class="list-p"><a href="https://temai.suning.com/" class="list-link">苏宁outlets</a></p>
<p class="list-p"><a href="https://www.suning.com/daogou/index.html"
class="list-link">导购指南</a></p>
<p class="list-p"><a href="https://pindao.suning.com/city/zhtsgjsgnew.html"
class="list-link">江苏馆</a></p>
</dd>
</dl>
<dl class="wzdhson-list">
<dt class="list-dt">主题频道</dt>
<dd>
<p class="list-p"><a href="https://dianqi.suning.com/" class="list-link">电器城</a></p>
<p class="list-p"><a href="https://chaoshi.suning.com/" class="list-link">苏宁超市</a></p>
<p class="list-p"><a href="https://shouji.suning.com/" class="list-link">手机</a></p>
<p class="list-p"><a href="https://sports.suning.com/" class="list-link">运动馆</a></p>
<p class="list-p"><a href="https://book.suning.com/" class="list-link">图书</a></p>
<p class="list-p"><a href="https://redbaby.suning.com/" class="list-link">红孩子母婴</a></p>
<p class="list-p"><a href="https://binggo.suning.com/" class="list-link">美妆个护</a></p>
<p class="list-p"><a href="https://pindao.suning.com/city/diannao.htm"
class="list-link">电脑</a></p>
<p class="list-p"><a href="https://fashion.suning.com/" class="list-link">服装城</a></p>
<p class="list-p"><a href="https://smarthome.suning.com/" class="list-link">智能生活</a></p>
<p class="list-p"><a href="https://pindao.suning.com/city/jiazhuang.htm"
class="list-link">家装馆</a></p>
<p class="list-p"><a href="https://pindao.suning.com/city/snqcsh.html"
class="list-link">苏宁汽车</a></p>
<p class="list-p"><a href="https://phb.suning.com/bdIndex.html" class="list-link">排行榜</a>
</p>
<p class="list-p"><a href="https://yao.suning.com/" class="list-link">医药馆</a></p>
<p class="list-p"><a href="https://pindao.suning.com/city/gyppc.html"
class="list-link">工业品</a></p>
</dd>
</dl>
<dl class="wzdhson-list">
<dt class="list-dt">生活助手</dt>
<dd>
<p class="list-p"><a href="https://passport.suning.com/ids/trustLogin?sysCode=epp&targetUrl=https://licai.suning.com/bof/bofIndex.htm" class="list-link">零钱宝</a></p>
<p class="list-p"><a href="https://chong.suning.com/eppscrp/mobile/fill.htm" class="list-link">手机充值</a></p>
<p class="list-p"><a href="https://sh.suning.com/life/at/memtrans!input.action" class="list-link">转账还款</a></p>
<p class="list-p"><a href="https://pindao.suning.com/city/bangke.html" class="list-link">约服务</a></p>
<p class="list-p"><a href="https://jiaofei.suning.com/eppspfi/cityLocation/getCityLocation.htm?pageType=1" class="list-link">水电煤</a></p>
<p class="list-p"><a href="https://jipiao.suning.com/" class="list-link">机票</a></p>
<p class="list-p"><a href="https://hotels.suning.com/" class="list-link">酒店</a></p>
</dd>
</dl>
<dl class="wzdhson-list">
<dt class="list-dt">会员服务</dt>
<dd>
<p class="list-p"><a href="https://vip.suning.com/" class="list-link">会员联盟</a></p>
<p class="list-p"><a href="https://ewsfspc.suning.com/extendIns/index.htm" class="list-link">延长保修</a></p>
<p class="list-p"><a href="https://passport.suning.com/ids/trustLogin?sysCode=epp&targetUrl=https://pay.suning.com/epp-epw/login/login.action" class="list-link">易付宝</a></p>
<p class="list-p"><a href="https://licai.suning.com/lcportal/licaiIndex.htm?res_message=NOT_LOGIN&res_code=4" class="list-link">苏宁理财</a></p>
<p class="list-p"><a href="https://jinrong.suning.com/" class="list-link">苏宁金融</a></p>
</dd>
</dl>
<dl class="wzdhson-list" style="border: transparent;">
<dt class="list-dt">更多热点</dt>
<dd>
<p class="list-p"><a href="https://www.pptv.com/" class="list-link">PP视频</a></p>
<p class="list-p"><a href="https://cc.suning.com/" class="list-link">合作招商</a></p>
<p class="list-p"><a href="https://union.suning.com/" class="list-link">苏宁联盟</a></p>
<p class="list-p"><a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Fueip.suning.com%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Fueip.suning.com%252Fpc%252Findex.htm&multipleActive=false" class="list-link">用户体验</a></p>
<p class="list-p"><a href="https://www.suningcloud.com/" class="list-link">苏宁云</a></p>
<p class="list-p"><a href="https://gongyi.suning.com/" class="list-link">苏宁公益</a></p>
<p class="list-p"><a href="https://snyh.suning.com/" class="list-link">苏宁有货</a></p>
</dd>
</dl>
</div>
</div>
<div class="top-left shangjiaruzhu">
<a href="#" class="top-line"><span class="top-span">商家入驻</span>
<em>∨</em>
</a>
<div class="sjrz-list">
<p class="list-p"><a href="https://cc.suning.com/" class="list-link">合作招商</a></p>
<p class="list-p"><a href="https://fuwu.suning.com/" class="list-link">服务市场</a></p>
<p class="list-p"><a href="https://qyjr.suning.com/" class="list-link">金融中心</a></p>
<p class="list-p"><a href="https://stc.suning.com/" class="list-link">培训中心</a></p>
<p class="list-p"><a href="https://ap.suning.com/aps-sale-web/auth/advertise.htm" class="list-link">一通天下</a></p>
<p class="list-p"><a href="https://rule.suning.com/" class="list-link">规则中心</a></p>
<P class="list-p"><a href="https://rule.suning.com/ruleVote/voteIndex.htm#" class="list-link">规则众议院</a></P>
</div>
</div>
<div class="topleft kehufuwu">
<a href="#" class="top-line"><span class="top-span">客户服务</span>
<em>∨</em>
</a>
<div class="khfw-list">
<p class="list-p"><a href="https://pindao.suning.com/city/bangke.html" class="list-link">苏宁帮客</a></p>
<p class="list-p"><a href="https://hc.suning.com/help/home.htm" class="list-link">帮助中心</a></p>
<p class="list-p"><a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Fsnasss.suning.com%2Fsnass-web%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Fsnasss.suning.com%252Fsnass-web%252Fpc%252FreturnGoods%252FtoAfterSaleApplyList.do&loginTheme=b2c&multipleActive=false" class="list-link">退换/维修</a></p>
<p class="list-p"><a href="https://ueip.suning.com/pc/index.htm" class="list-link">意见反馈</a></p>
<p class="list-p"><a href="https://cuxiao.suning.com/serve.html" class="list-link">30天包退</a></p>
<p class="list-p"><a href="https://hc.suning.com/serviceSummary/getBannerListPC.htm" class="list-link">省心购</a></p>
<p class="list-p"><a href="https://assss.suning.com/assss-web/pc/telephoneCustomer/home.do" class="list-link">电话客服</a></p>
<p class="list-p"><a href="https://yxchat.suning.com/index.html?bizCode=005A010101000000&custNo=&bizSeq=005A" class="list-link">在线咨询</a></p>
</div>
</div>
<div class="top-left wuzhangai">
<p class="list-p"><a href="#" class="list-link sub">网页无障碍</a></p>
</div>
<div class="top-left diqu">
<span class="top-span city"><a href="#" class="list-link" style="color:#333;">泰安</a></span>
</div>
</div>
<div class="top-right">
<div class="fonction"></div>
<div class="top-right phonesuning">
<a href="#" class="top-line">手机苏宁</a>
<em>∨</em>
<div class="phone-list">
<ul>
<li><img src="pic1.png" alt="" class="phone-pic"><p class="phone-p">扫一扫</p>
<p class="phone-p">下载苏宁易购</p></li>
<li><img src="pic2.png" alt="" class="phone-pic"><p class="phone-p">关注苏宁推客公众号</p>
<p class="phone-p">自购省钱·分享赚钱</p></li>
<li><img src="pic3.png" alt="" class="phone-pic"><p class="phone-p">扫一扫</p>
<p class="phone-p">下载苏宁金融APP</p></li>
<li>
<img src="pic4.png" alt="" class="phone-pic">
<p class="phone-p">扫一扫</p>
<p class="phone-p">关注苏宁易购服务号</p></li>
</ul>
</div>
</div>
<a href="" class="top-right qiyecaigou top-line" >企业采购</a>
<a href="" class="top-right yifubao top-line">易付宝</a>
<div class="top-right gouwuche">
<a href="https://shopping.suning.com/cart.do?safp=d488778a.homepagev8.lQl9p.1&safpn=10001" class="top-line" style="color: #ff6600;">购物车 0</a>
<em>∨</em>
<div class="gwc-list">
<img src="../../案例/haro2.png" alt="" class="gwc-pic">
<h5 class="gwc-h5">不要让您的购物车空着哦，快去逛逛吧</h5> <br>
<div class="sec">
<p class="sec-p">如果您已添加过宝贝，那就赶紧登录查看吧</p>
<a href="#" class="button">登录</a>
</div>
</div>
</div>
<a href="https://vip.suning.com/?safp=d488778a.homepagev8.lAi5.0&safpn=10001" class="top-right membership top-line">苏宁会员</a>
<div class="top-right mysuning">
<a href="" class="top-line">我的易购</a>
<em>∨</em>
<div class="mysuning-list">
<div class="mysuning-top">
<img src="tool-logo.png" alt="" class="sun-pic">
<span class="mysuning-span">
<a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Floginst.suning.com%2F%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Fwww.suning.com%252F&method=GET&loginTheme=b2c" class="sun-right">请登录</a>
</span>
</div>
<div class="mysun-left">
<a href="//snwm.suning.com/"" class="top-line mysun">我的消息</a>
<a href="https://passport.suning.com/ids/trustLogin?sysCode=epp&targetUrl=http://my.jr.suning.com/sfp/accountAssets/index.htm" class="top-line mysun">我的金融</a>
<a href="#" class="top-line mysun">我的任性付</a>
</div>
<div class="mysun-right">
<a href="//favorite.suning.com/myFavoriteImg.do" class="top-line mysun">我的关注</a>
<a href="#" class="top-line mysun">苏宁会员</a>
<a href="#" class="top-line mysun">我的优惠券</a>
</div>
</div>
</div>
<div class="top-right myorder">
<a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Forder.suning.com%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Forder.suning.com%252Forder%252ForderList.do%253Fsafpn%253D10001&loginTheme=b2c&multipleActive=false" class="top-line">
我的订单
</a>
<em>∨</em>
<div class="order-list">
<p class="list-p order"><a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Forder.suning.com%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Forder.suning.com%252Forder%252ForderList.do%253FtransStatus%253DwaitPay&loginTheme=b2c&multipleActive=false" class="list-link">待支付</a></p>
<p class="list-p order"><a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Forder.suning.com%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Forder.suning.com%252Forder%252ForderList.do%253FtransStatus%253DwaitReceive&loginTheme=b2c&multipleActive=false" class="list-link">待收货</a></p>
<p class="list-p order"><a href="https://review.suning.com/my_cmmdty_review.do" class="list-link">待评价</a></p>
<p class="list-p order"><a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Fsnasss.suning.com%2Fsnass-web%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Fsnasss.suning.com%252Fsnass-web%252Fpc%252Fmodify%252FtoModifyOrderList.do&loginTheme=b2c&multipleActive=false" class="list-link">修改订单</a></p>
</div>
</div>
<div class="top-right denglu"><a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Floginst.suning.com%2F%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Fwww.suning.com%252F&method=GET&loginTheme=b2c" class="top-line">请登录</a>
<a href="https://reg.suning.com/person.do" class="top-line zhuce">注册有礼</a>
</div>
</div>
</div>
<div class="bar">
<div class="bar-inner">
<a href="https://www.suning.com/"><img src="yigou.png" alt="" class="inner-pic"></a>
<div class="inner-search">
<div class="inner-search-inner">
<div class="input-out"><input type="text" class="inner-input" value="热水器精选"></div>
<input type="submit" class="sousuo" value="搜索">
<div class="search-bottom">
<a href="https://search.suning.com/%E6%89%8B%E6%9C%BA/?safp=d488778a.homepagev8.gSearch.3&safc=hotkeyword.0.0&safpn=10001" class="top-line bottom" style="border: none;">手机</a>
<a href="https://re.suning.com/keyword/%E6%B4%97%E8%A1%A3%E6%9C%BA/?utm_source=zn-zf-tt5-o2-ad&utm_medium=ab-bx6-0000-pc2-rb&adtype=3&safp=d488778a.homepagev8.gSearch.4&safc=hotkeyword.2.1738820120220530" class="top-line bottom" style="color:#ff6600">爆款洗衣机</a>
<a href="https://search.suning.com/%E5%86%B0%E7%AE%B1/?safp=d488778a.homepagev8.gSearch.5&safc=hotkeyword.0.0&safpn=10001" class="top-line bottom">冰箱</a>
<a href="https://re.suning.com/keyword/%E5%A5%B6%E7%B2%89/?utm_source=zn-zf-tt5-o1-ad&utm_medium=ab-hhz6-0000-z1-nf-rb&adtype=3&safp=d488778a.homepagev8.gSearch.6&safc=hotkeyword.2.1738820920220530" class="top-line bottom" style="color:#ff6600">奶粉特惠购</a>
<a href="https://re.suning.com/keyword/%E5%BA%8A/?utm_source=zn-zf-tt5-o1-ad&utm_medium=ab-jz6-0000-z1-jj-rb&adtype=3&safp=d488778a.homepagev8.gSearch.7&safc=hotkeyword.2.1738821120220530" class="top-line bottom" style="color:#ff6600">品质家具购</a>
<a href="https://search.suning.com/%E7%94%B5%E8%A7%86/?safp=d488778a.homepagev8.gSearch.8&safc=hotkeyword.0.0&safpn=10001" class="top-line bottom">电视</a>
<a href="https://search.suning.com/ipad/?safp=d488778a.homepagev8.gSearch.9&safc=hotkeyword.0.0&safpn=10001" class="top-line bottom">ipad</a>
<a href="https://search.suning.com/%E7%83%AD%E6%B0%B4%E5%99%A8/?safp=d488778a.homepagev8.gSearch.10&safc=hotkeyword.0.0&safpn=10001" class="top-line bottom">热水器</a>
<a href="https://search.suning.com/%E6%B2%99%E5%8F%91/?safp=d488778a.homepagev8.gSearch.11&safc=hotkeyword.0.0&safpn=10001" class="top-line bottom">沙发</a>
</div>
</div>
</div>
</div>
</div>
<div class="bar-line">
<div class="bar-line-left"><a href="https://list.suning.com/?safp=d488778a.homepagev8.126605238626.1&safpn=10001" class="bar-left-link">
<i class="bar-left-i"></i>
<span class="bar-left-span">分类</span>
</a>
</div>
<div class="bar-line-inner">
<ul class="bar-line-ul">
<li class="title-pic">
<a href="https://qiang.suning.com/pc/brandBenefits.html" class="title-pic-a"><img src="big.png" alt="" style="width:110px;height:38px"></a>
</li>
<li class="bar-line-li"><a href="https://dianqi.suning.com/" class="title-link">电器城</a></li>
<li class="bar-line-li"><a href="https://pindao.suning.com/city/wan3C.html" class="title-link">手机数码</a></li>
<li class="bar-line-li"><a href="https://chaoshi.suning.com/" class="title-link">苏宁超市</a></li>
<li class="bar-line-li"><a href="https://pindao.suning.com/city/jiazhuang.html" class="title-link">家具建材</a></li>
<li class="bar-line-li"><a href="https://pindao.suning.com/" class="title-link">生活家电</a></li>
<li class="bar-line-li"><a href="https://pindao.suning.com/city/bangke.html" class="title-link">帮客服务</a></li>
<li class="bar-line-li"><a href="https://jinrong.suning.com/" class="title-link">金融</a></li>
</ul>
</div>
<div class="bar-line-right">
<a href="https://hc.suning.com/help/channel-154537312397774529.htm" class="bar-right-link">
<img src="../../案例/right.png" alt="" class="bar-right-pic">
</a>
</div>
</div>
<div class="banner">
<div class="sort-left-left"></div>
<div class="sort-left">
<ul class="sort-left-list">
<li class="sort-left-list-li fist-li">
<img src="../../案例/first.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://shouji.suning.com/phone2018.html?safp=d488778a.homepagev8.126605238628.1&safpn=10001" class="sort-left-link">手机</a>
<em class="sort-em">/</em>
<a href="https://yys.suning.com/" class="sort-left-link">运营商</a></div>
<div class="sort-box first-box"></div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/tv.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://dianqi.suning.com/newhome3.html?safp=d488778a.homepagev8.126605238630.1&safpn=10001" class="sort-left-link">家用电器</a>
<em class="sort-em">/</em>
<a href="https://pindao.suning.com/city/bangke.html?safp=d488778a.homepagev8.126605238630.2&safpn=10001" class="sort-left-link">帮客</a>
</div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/clean.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://pindao.suning.com/city/chuwei.html?safp=d488778a.homepagev8.126605238632.1&safpn=10001" class="sort-left-link">厨卫</a>
<em class="sort-em">/</em>
<a href="https://pindao.suning.com/city/xiaojiadian.html?safp=d488778a.homepagev8.126605238632.2&safpn=10001" class="sort-left-link">生活家电</a>
<em class="sort-em">/</em>
<a href="https://pindao.suning.com/city/chuiju.html?safp=d488778a.homepagev8.126605238632.3&safpn=10001" class="sort-left-link">厨具</a>
</div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/cpc.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://pindao.suning.com/city/diannao.html?safp=d488778a.homepagev8.126605238634.1&safpn=10001" class="sort-left-link">电脑办公
<em class="sort-em">/</em>
<a href="https://pindao.suning.com/city/shuma.htm?safp=d488778a.homepagev8.126605238634.2&safpn=10001" class="sort-left-link">相机</a>
</a>
</div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/sofa.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://pindao.suning.com/city/jiajuguan.html?safp=d488778a.homepagev8.126605238636.1&safpn=10001" class="sort-left-link">家具</a>
<em class="sort-em">/</em>
<a href="https://pindao.suning.com/city/jiazhuang.html?safp=d488778a.homepagev8.126605238636.2&safpn=10001" class="sort-left-link">家装</a>
<em class="sort-em">/</em>
<a href="https://list.suning.com/0-161645-0.html?safp=d488778a.homepagev8.126605238636.3&safc=cate.0.0&safpn=10001" class="sort-left-link">家纺</a>
<em class="sort-em">/</em>
<a href="https://list.suning.com/0-456005-0.html?safp=d488778a.homepagev8.126605238636.4&safc=cate.0.0&safpn=10001" class="sort-left-link">灯具</a>
</div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/candy.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://list.suning.com/0-500353-0.html?safp=d488778a.homepagev8.126605238638.1&safc=cate.0.0&safpn=10001" class="sort-left-link">食品</a>
<em class="sort-em"></em>
<a href="https://search.suning.com/%E9%85%92/?safp=d488778a.homepagev8.126605238638.2&safpn=10001" class="sort-left-link">酒水</a>
<em class="sort-em"></em>
<a href="https://search.suning.com/%E7%94%9F%E9%B2%9C/?safp=d488778a.homepagev8.126605238638.3&safpn=10001" class="sort-left-link">生鲜</a>
<em class="sort-em"></em>
<a href="https://china.suning.com/" class="sort-left-link">特产</a>
</div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/lipstick.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://search.suning.com/%E6%8A%A4%E8%82%A4/?safp=d488778a.homepagev8.126605238640.1&safpn=10001" class="sort-left-link">美妆</a>
<em class="sort-em">/</em>
<a href="https://search.suning.com/%E6%B4%97%E6%8A%A4/?safp=d488778a.homepagev8.126605238640.2&safpn=10001" class="sort-left-link">个护</a>
<em class="sort-em">/</em>
<a href="https://list.suning.com/0-161657-0.html?safp=d488778a.homepagev8.126605238640.3&safc=cate.0.0&safpn=10001" class="sort-left-link">清洁</a>
<em class="sort-em">/</em>
<a href="https://list.suning.com/0-500552-0.html?safp=d488778a.homepagev8.126605238640.4&safc=cate.0.0&safpn=10001" class="sort-left-link">宠物</a>
</div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/pram.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://search.suning.com/%E7%8E%A9%E5%85%B7/?safp=d488778a.homepagev8.126605238642.2&safpn=10001" class="sort-left-link">母婴</a>
<em class="sort-em">/</em>
<a href="https://cuxiao.suning.com/scms/tczycardayPC.html?safp=d488778a.homepagev8.126605238642.3&safpn=10001" class="sort-left-link">玩具</a>
<em class="sort-em">/</em>
<a href="https://cuxiao.suning.com/scms/tczycardayPC.html?safp=d488778a.homepagev8.126605238642.3&safpn=10001" class="sort-left-link">车床</a>
<em class="sort-em">/</em>
<a href="https://cuxiao.suning.com/scms/tztxcxye.html?safp=d488778a.homepagev8.126605238642.4&safpn=10001" class="sort-left-link">童装</a>
</div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/ball.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://pindao.suning.com/ydhwpc.html?safp=d488778a.homepagev8.126605238644.1&safpn=10001" class="sort-left-link">运动</a>
<em class="sort-em">/</em>
<a href="https://list.suning.com/0-420008-0.html?safp=d488778a.homepagev8.126605238644.2&safc=cate.0.0&safpn=10001" class="sort-left-link">户外</a>
<em class="sort-em">/</em>
<a href="https://search.suning.com/%E5%9B%BD%E9%99%85%E7%B1%B3%E5%85%B0/?safp=d488778a.homepagev8.126605238644.3&safpn=10001" class="sort-left-link">国米</a>
<em class="sort-em">/</em>
<a href="https://list.suning.com/0-420010-0.html?safp=d488778a.homepagev8.126605238644.4&safc=cate.0.0&safpn=10001" class="sort-left-link">骑行</a>
</div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/clothe.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://list.suning.com/0-161007-0.html?safp=d488778a.afpxBezaab.142794358.5d45d1b77b&safc=cate.0.0&safpn=10003.00015" class="sort-left-link">女装</a>
<em class="sort-em">/</em>
<a href="https://search.suning.com/%E7%94%B7%E8%A3%85/?safp=d488778a.afpxBezaab.142794358.5d45d1b77b&safpn=10003.00015" class="sort-left-link">男装</a>
<em class="sort-em">/</em>
<a href="https://search.suning.com/%E5%86%85%E8%A1%A3/?safp=d488778a.afpxBezaab.142794358.5d45d1b77b&safpn=10003.00015" class="sort-left-link">内衣</a>
<em class="sort-em">/</em>
<a href="https://fashion.suning.com/?safp=d488778a.homepagev8.126605238646.4&safpn=10001" class="sort-left-link">鞋靴</a>
</div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/purse.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://pindao.suning.com/city/xiangbao.html?safp=d488778a.homepagev8.126605238648.1&safpn=10001" class="sort-left-link">箱包</a>
<em class="sort-em">/</em>
<a href="https://pindao.suning.com/city/zhongbiaoyanjing.html?safp=d488778a.homepagev8.126605238648.2&safpn=10001" class="sort-left-link">钟表</a>
<em class="sort-em">/</em>
<a href="https://pindao.suning.com/city/zhubao.html?safp=d488778a.homepagev8.126605238648.3&safpn=10001" class="sort-left-link">珠宝</a>
<em class="sort-em">/</em>
<a href="https://pindao.suning.com/city/stamp.html?safp=d488778a.homepagev8.126605238648.4&safpn=10001" class="sort-left-link">艺术</a>
</div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/car.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://pindao.suning.com/city/snqcsh.html?safp=d488778a.homepagev8.126605238650.1&safpn=10001" class="sort-left-link">汽车</a>
<em class="sort-em">/</em>
<a href="https://search.suning.com/%E7%94%B5%E5%8A%A8%E8%BD%A6/&ci=504570&iy=-1&st=0?safp=d488778a.homepage1.99345513004.68&safpn=10001#search-path" class="sort-left-link">电摩</a>
<em class="sort-em">/</em>
<a href="https://search.suning.com/%E6%B1%BD%E8%BD%A6%E7%94%A8%E5%93%81/?safp=d488778a.homepagev8.126605238650.3&safpn=10001" class="sort-left-link">汽车用品</a>
</div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/health.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://yao.suning.com/?safp=d488778a.homepagev8.126605238654.1&safpn=10001" class="sort-left-link">医药健康</a>
<em class="sort-em">/</em>
<a href="https://yao.suning.com/?safp=d488778a.homepagev8.126605238654.2&safpn=10001" class="sort-left-link">计生情趣</a>
</div>
</li>
<li class="sort-left-list-li">
<img src="../../案例/rank.png" alt="" class="sort-left-img">
<div class="sort-inner">
<a href="https://licai.suning.com/lcportal/licaiIndex.htm?channelCode=PC_YGMstation" class="sort-left-link">理财</a>
<em class="sort-em">/</em>
<a href="https://paypassport.suning.com/ids/login?service=https%3A%2F%2Frxf.suning.com%2Fepps-cpf%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Frxf.suning.com%252Fepps-cpf%252FaccountMgt%252FassetOverview.do&loginTheme=defaultTheme" class="sort-left-link">分期</a>
<em class="sort-em">/</em>
<a href="https://pay.suning.com/epp-epw/lifecenter/index.action" class="sort-left-link">便民</a>
</div>
</li>
<li class="sort-left-list-li">
<div class="sort-inner">
<a href="" class="sort-left-link"></a>
<em class="sort-em"></em>
<a href="" class="sort-left-link"></a>
<em class="sort-em"></em>
<a href="" class="sort-left-link"></a>
<em class="sort-em"></em>
<a href="" class="sort-left-link"></a>
</div>
</li>
</ul>
</div>
<a href="https://shop.suning.com/30000400/index.html?safp=d488778a.homepagev8.126605338677.16&safc=shop.0.0&safpn=10001" class="banner-a"><img src="iphone.jpg" alt="" class="banner-pic"></a>
<div class="sort-right">
<div class="top-box">
<div class="top-box-top">
<img src="tool-logo.png" alt="" class="box-top-img">
<div class="top-box-top-inner">
<p class="top-box-top-p">Hi,欢迎来到苏宁易购</p>
<a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Fssl.suning.com%2F%2Fwebapp%2Fwcs%2Fstores%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Fwww.suning.com%252F%253Futm_source%253Dunion%2526utm_medium%253D005007%2526adtype%253D5%2526utm_campaign%253Dd4886d83-e130-429b-9b31-caffbe7173cc%2526union_place%253Dun&method=GET&loginTheme=b2c" class="top-inner-inner">登录</a>
<em class="p-em">|</em>
<a href="https://reg.suning.com/person.do" class="top-inner-inner">注册</a>
</div>
</div>
<div class="top-box-bottom">
<a href="https://cuxiao.suning.com/scms/xinren_pc.html?safp=d488778a.homepagev8.0.5d8065e013&safpn=10001" class="kehu">199新人专享</a>
<a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Fsupervip.suning.com%2Fsnprime-web%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Fsupervip.suning.com%252Fsnprime-web%252FtoIndex.do%253Fsafp%253Dd488778a.homepagev8.0.c6a990552a%2526safpn%253D10001&loginTheme=b2c&multipleActive=false" class="super">开通super尊享特权</a>
</div>
</div>
<div class="bottom-box">
<div class="bottom-box-link">
<a href="https://cuxiao.suning.com/scms/PCred.html?safp=d488778a.homepagev8.126605338681.1&safpn=10001" class="bottom-box-link-a">
<img src="../../案例/hongbao.png" alt="" class="bottom-box-img addition">
<p class="bottom-box-p">领红包</p>
</a>
<a href="https://passport.suning.com/ids/login?service=https%3A%2F%2Fsign.suning.com%2Fsign-web%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Fsign.suning.com%252Fsign-web%252Fsign%252Fwelcome.do%253Fsafp%253Dd488778a.homepagev8.126605338681.2%2526safpn%253D10001&loginTheme=b2c&multipleActive=false" class="bottom-box-link-a">
<img src="../../案例/yunzuan.png" alt="" class="bottom-box-img addition">
<p class="bottom-box-p">领云钻</p>
</a>
<a href="https://quan.suning.com/lq_1.htm?safp=d488778a.homepagev8.126605338681.3&safpn=10001#classId=1" class="bottom-box-link-a">
<img src="../../案例/money.png" alt="" class="bottom-box-img addition">
<p class="bottom-box-p">抢神券</p>
</a>
</div>
<div class="bottom-box-link">
<a href="https://chong.suning.com/eppscrp/mobile/fill.htm" class="bottom-box-link-a">
<img src="../../案例/huafei.png" alt="" class="bottom-box-img">
<p class="bottom-box-p">话费充值</p>
</a>
<a href="https://jiaofei.suning.com/eppspfi/cityLocation/getCityLocation.htm?pageType=1" class="bottom-box-link-a">
<img src="../../案例/shuidianfei.png" alt="" class="bottom-box-img">
<p class="bottom-box-p">水电煤</p>
</a>
<a href="https://ka.suning.com/" class="bottom-box-link-a">
<img src="../../案例/card.png" alt="" class="bottom-box-img">
<p class="bottom-box-p">苏宁卡</p>
</a>
</div>
<div class="bottom-box-link">
<a href="https://licai.suning.com/lcportal/licaiIndex.htm" class="bottom-box-link-a">
<img src="../../案例/licai.png" alt="" class="bottom-box-img">
<p class="bottom-box-p">理财</p>
</a>
<a href="https://paypassport.suning.com/ids/login?service=https%3A%2F%2Frxf.suning.com%2Fepps-cpf%2Fauth%3FtargetUrl%3Dhttps%253A%252F%252Frxf.suning.com%252Fepps-cpf%252FaccountMgt%252FassetOverview.do&loginTheme=defaultTheme" class="bottom-box-link-a">
<img src="../../案例/fenqi.png" alt="" class="bottom-box-img">
<p class="bottom-box-p">分期</p>
</a>
<a href="https://gongyi.suning.com/" class="bottom-box-link-a">
<img src="../../案例/gongyi.png" alt="" class="bottom-box-img">
<p class="bottom-box-p">苏宁公益</p>
</a>
</div>
<div class="bottom-box-link">
<a href="https://mc.suning.com/Medicine/home/index" class="bottom-box-link-a">
<img src="../../案例/yak.png" alt="" class="bottom-box-img">
<p class="bottom-box-p">药品信息</p>
</a>
<a href="https://hx.suning.com/" class="bottom-box-link-a">
<img src="../../案例/huanxin.png" alt="" class="bottom-box-img">
<p class="bottom-box-p">以旧换新</p>
</a>
<a href="https://www.snisc.cn/" class="bottom-box-link-a">
<img src="../../案例/insuranc.png" alt="" class="bottom-box-img">
<p class="bottom-box-p">保险</p>
</a>
</div>
</div>
</div>
<div class="sort-right-right">
</div>
<div class="banner-center">
<ul class="banner-center-ul">
<li class="banner-center-li">
<a href="https://re.suning.com/keyword/%E5%86%B0%E6%B4%97/?utm_source=zn-zf-tt5-o2-ad&utm_medium=ab-bx6-0000-z1-bx-rb&adtype=3&safp=d488778a.homepagev8.126605338679.1&safc=0.2.1739230020220609" class="banner-center-a">
<img src="../../案例/hanaa.png" alt="" class="banner-center-img">
</a>
</li>
<li class="banner-center-li">
<a href="https://re.suning.com/keyword/%E6%B2%99%E5%8F%91/?utm_source=zn-zf-tt5-o1-ad&amp;amp;amp;amp;utm_medium=ab-jz6-0000-z1-jj-rb&adtype=3&safp=d488778a.homepagev8.126605338679.2&safc=0.2.1722161820220609" class="banner-center-a">
<img src="../../案例/tul.png" alt="" class="banner-center-img">
</a>
</li>
<li class="banner-center-li">
<a href="https://re.suning.com/keyword/%E5%A5%B6%E7%B2%89/?utm_source=zn-zf-tt5-o1-ad&amp;utm_medium=ab-hhz6-0000-z1-nf-rb&adtype=3&safp=d488778a.homepagev8.126605338679.3&safc=0.2.1746784020220609" class="banner-center-a">
<img src="../../案例/set.png" alt="" class="banner-center-img">
</a>
</li>
<li class="banner-center-li">
<a href="https://re.suning.com/keyword/%E7%83%AD%E6%B0%B4%E5%99%A8/?utm_source=zn-zf-tt5-o2-ad&utm_medium=ab-cw6-0000-z1-rsq-rb&adtype=3&safp=d488778a.homepagev8.126605338679.4&safc=0.2.1746784520220609" class="banner-center-a">
<img src="../../案例/net.png" alt="" class="banner-center-img">
</a>
</li>
</ul>
</div>
</div>css↓
* {
padding:0;
margin:0;
}
body
{
width: 1690.67px;
height: 3103px;
}
.top
{
width: 1690.67px;
height: 36px;
background-color: #f5f5f5;
z-index: 100;
}
.top-left
{
width: 401px;
height: 35px;
float:left;
}
.top-right
{
width: 647.3px;
height: 35px;
float:right;
}
.blocked
{
width: 80px;
height: 35px;
float: left;
}
.wangzhandaohang
{
width: 65px;
height: 36px;
float:left;
margin:0;
padding: 0 10px;
border-left:transparent solid 1px;
border-right:transparent solid 1px;
}
.wangzhandaohangson
{
width: 988px;
height: 244px;
padding: 10px 0;
border:1px solid #eee;
border-top: transparent;
background-color: #ffffff;
position: absolute;
left:80px;
display: none;
z-index: 100000;
}
.wangzhandaohang:hover .wangzhandaohangson
{
display: block;
}
.shangjiaruzhu
{
width: 61px;
height:36px;
float:left;
margin:0;
padding: 0 10px;
border-left:transparent solid 1px;
border-right:transparent solid 1px;
}
.kehufuwu
{
width: 63px;
height: 36px;
float: left;
margin:0;
padding: 0 10px;
border-left:transparent solid 1px;
border-right:transparent solid 1px;
}
.wuzhangai
{
width: 40px;
height: 35px;
float:left;
margin:0;
padding: 0 10px;
}
.diqu
{
width: 57px;
height: 35px;
float: left;
margin:0;
padding: 0 10px;
background-image: url(../../案例/location.png);
background-repeat: no-repeat;
background-position: 10px 7px;
}
em
{
font-style: normal;
display: inline-block;
color: #cad5eb;
line-height: 35px;
font-size: 12px;
}
.top-line
{
text-decoration: none;
color: #666;
line-height: 35px;
font-size: 12px;
}
.top-line:hover{
color:#ff6600;
}
.wangzhandaohang:hover
{
background-color: #ffffff;
border-left:#dddddd solid 1px;
border-right:#dddddd solid 1px;
/* box-sizing:border-box; */
}
.shangjiaruzhu:hover
{
background-color: #ffffff;
border-left:#dddddd solid 1px;
border-right:#dddddd solid 1px;
}
.kehufuwu:hover{
background-color: #ffffff;
border-left:#dddddd solid 1px;
border-right:#dddddd solid 1px;
}
.top-span
{
display: inline-block;
width: 48px;
height: 35px;
}
dl
{
display: block;
margin-block-start: 1em;
margin-block-end: 1em;
margin-inline-start: 0px;
margin-inline-end: 0px;
}
.wzdhson-list
{
float: left;
width: 176px;
border-right: 1px solid #eee;
padding-left: 20px;
z-index: 100000;
background-color: #fff;
}
.list-dt
{
height: 25px;
width: 100%;
font-size: 14px;
font-family: "Microsoft Yahei";
line-height: 17px;
width: 176px;
height: 25px;
}
.list-link
{
color:#666;
text-decoration: none;
line-height: 25px;
font-size: 12px;
}
.list-link:hover
{
color: #ff6600;
}
.list-p
{
width: 78px;
height: 25px;
display: block;
float:left;
}
.sjrz-list
{
width: 164px;
padding:10px;
height: 100px;
border: 1px solid #eee;
position: absolute;
left: 167px;
border-top: transparent;
display: none;
z-index: 100001;
background-color: #fff;
}
.shangjiaruzhu:hover .sjrz-list
{
display: block;
}
.khfw-list
{
width: 162px;
padding:10px;
height:100px;
border: 1px solid #eee;
border-top: transparent;
position: absolute;
left:151px;
display: none;
z-index: 100000;
background-color: #fff;
}
.kehufuwu:hover .khfw-list{
display: block;
}
.list-link.sub
{
line-height:35px ;
}
.top-span.city
{
font-size: 10px;
line-height: 35px;
text-align: right;
}
.top-right
{
width: 691.35px;
height: 35px;
display: block;
float: right;
text-align: center;
}
.denglu
{
width: 117.56px;
height: 35px;
}
.zhuce
{
color: #ff6600;
padding-left: 10px;
}
.myorder
{
width: 83px;
height: 36px;
margin:0;
border-left:transparent solid 1px;
border-right:transparent solid 1px;
}
.myorder:hover{
background-color:#ffffff ;
}
.mysuning
{
width: 83px;
height: 36px;
text-align: center;
border-left:transparent solid 1px;
border-right:transparent solid 1px;
}
.membership
{
display: block;
width: 68px;
height: 35px;
}
.gouwuche
{
width: 96.73px;
height: 36px;
/* text-align: center; */
border: 1px solid transparent;
}
.gouwuche:hover{
background-color: #fff;
color:#e65c00;
border: 1px solid #eee;
border-bottom: transparent;
}
.yifubao
{
display: block;
width: 56px;
height: 35px;
}
.qiyecaigou
{
display: block;
width: 68px;
height: 35px;
}
.phonesuning
{
display: block;
height: 36px;
width: 68px;
border: 1px solid transparent;
}
.fonction
{
height: 35px;
width:40px;
float: right;
background-image: url(../../案例/function2.png);
background-repeat: no-repeat;
}
.order-list
{
padding: 10px;
width: 63px;
height: 100px;
border: 1px solid #eee;
border-top:transparent;
display: none;
background-color: #fff;
z-index: 200;
}
.list-p.order
{
width: 63px;
}
.myorder:hover .order-list
{
display: block;
}
.mysuning:hover
{
background-color: #ffffff;
}
.mysuning-list
{
width:180px;
height: 170px;
background-color: #ffffff;
border: 1px solid #eee;
padding:10px;
display: none;
border-top: transparent;
z-index: 1;
}
.mysuning:hover .mysuning-list
{
display: block;
}
.mysuning-top
{
width:180px;
height: 56px;
}
.top-line.mysun
{
width: 70px;
height: 30px;
padding:0 0 0 10px;
display:block;
}
.sun-pic
{
width: 54px;
height: 54px;
display: block;
float: left;
padding:0 0 0 10px;
}
.mysun-left
{
width: 80px;
float:left;
}
.mysun-right
{
width: 80px;
float:right;
}
.sun-right
{
width: 91px;
height: 56px;
display: block;
float:right;
line-height: 56px;
text-decoration: none;
}
.mysuning-span
{
text-decoration: none;
color: #666;
text-align: center;
font-size: 12px;
}
.sun-right:hover
{
color:#ff6600;
}
.gwc-list
{
width: 280px;
height: 400px;
padding-top: 20px;
border: 1px solid #eee;
border-top: transparent;
display: none;
z-index: 3000;
background-color: #fff;
position: relative;
}
.gouwuche:hover .gwc-list
{
display: block;
}
.gwc-h5
{
font-size: 12px;
color: #bbbbbb;
}
.sec-p
{
color:#bbb;
font-size: 10px;
}
.button
{
display: block;
color:#ffffff;
width: 68px;
height: 25px;
background-color: #ff6600;
text-decoration: none;
font-size: 13px;
line-height: 25px;
margin:5px auto;
}
li{
list-style: none;
display: inline-block;
}
.phone-list
{
width: 508px;
height: 182px;
position: absolute;
left: 781px;
border: 1px solid #eee;
padding:10px;
border-top: transparent;
display: none;
background-color: #fff;
z-index: 3000;
}
.phonesuning:hover .phone-list
{
display: block;
}
.phone-p
{
font-size: 12px;
}
.phonesuning:hover
{
background-color: #fff;
border: 1px solid #eee;
border-bottom: transparent;
}
.bar
{
width: 1690.67px;
height: 110px;
z-index: -1;
}
.bar-inner
{
width: 1190px;
height: 100px;
margin:0 auto;
position: relative;
z-index: -3;
}
.inner-pic
{
width: 190px;
height: 90px;
display: block;
float:left;
}
.inner-search
{
width: 600px;
height: 100px;
position: absolute;
top:0;
right: 290px;
}
.inner-search-inner
{
width: 540px;
height: 63px;
margin:30px 0 0 0;
display: inline;
position: relative;
float: right;
}
.input-out
{
width: 390px;
height: 36px;
padding:0 0 0 28px;
border:2px solid #ff8000;
border-radius: 15px 0 0 15px;
background-image: url(../../案例/ss.png);
background-repeat: no-repeat;
background-position: 2px 7px;
}
.inner-input
{
width: 380px;
height: 18px;
padding:9px 10px 9px 0;
/* border: transparent; */
outline:none;
display: block;
border:0;
color: #cccccc;
font-size: 10px;
}
.sousuo
{
width: 120px;
height: 40px;
position: absolute;
right:0;
top:0;
background-color: #ff8000;
border-radius: 0 15px 15px 0;
border: 0;
font-size: 18px;
color: #fff;
font-weight: bold;
}
.search-bottom
{
width: 540px;
height: 18px;
margin-top: 5px;
}
.top-line.bottom
{
line-height: 12px;
width:24px;
height: 12px;
padding: 0 10px 0 7px;
border-left: 1px solid #ddd;
color: #999;
}
.top-line.bottom:hover
{
color:#ff6600;
}
.bar-line
{
width: 1690.67px;
height: 38px;
}
.bar-line-inner
{
width: 785px;
height: 38px;
margin: 0 auto;
display: inline-block;
position: relative;
left: 251px;
}
.bar-line-ul li
{
display: block;
float: left;
width: 85px;
height: 38px;
}
.bar-line-left
{
width: 200px;
height: 38px;
position: relative;
left: 248px;
top: -14px;
background-color: #ff8000;
display: inline-block;
border-radius: 12px 12px 0 0;
}
.bar-left-i
{
width: 14px;
height: 14px;
}
.bar-left-span
{
display: block;
font-size: 13px;
line-height: 38px;
text-decoration: none;
color:#fff;
font-weight: bold;
position: relative;
left: 30px;
}
.bar-left-link
{
width: 200px;
height: 38px;
display: block;
}
.bar-line-right
{
width: 196px;
height: 39px;
position: absolute;
left: 1241px;
top: 145px;
}
.bar-right-link
{
z-index: -30000;
position: relative;
}
.bar-right-pic
{
width: 196px;
height: 39px;
display: block;
z-index: -4;
}
.title-pic
{
width: 110px!important;
height: 38px!important;
}
.title-link
{
text-decoration: none;
display: block;
line-height: 38px;
text-align: center;
font-weight: bold;
color: rgb(51, 51, 51);
}
.title-link:hover{
color: #ff6600;
}
.banner
{
width: 1690.67px;
height: 476px;
z-index: 0;
position: absolute;
}
.banner-pic
{
width: 794px;
height: 476px;
display: block;
margin: 0 auto;
z-index:0;
float: left;
}
.sort-left
{
width: 200px;
height: 476px;
background-color: #fff;
float: left;
left: 247px;
}
.sort-left-left
{
width: 247px;
height: 476px;
float: left;
background-color: #ebebeb;
}
.sort-left-list-li
{
position:relative;
width: 200px;
height: 30px;
}
.sort-left-list-li:hover
{
background-color: #f3f3f3;
}
.sort-left-img
{
position: absolute;
width: 16px;
height: 16px;
left: 6px;
top: 7px;
display: inline-block;
}
.sort-inner
{
display: inline-block;
position: absolute;
left: 30px;
font-size: 14px;
}
.sort-left-link
{
text-decoration: none;
color: #000;
line-height: 30px;
}
.sort-left-link:hover
{
color: #ff6600;
}
.sort-em{
color:#000;
}
.sort-box
{
width: 989px;
height: 485.33px;
background-color: #fff;
display: none;
position: absolute;
left: 200px;
z-index: 2;
}
.fist-li:hover .first-box
{
display: block;
}
.sort-right
{
width:196px;
height: 476px;
background-color: #fff;
float: left;
z-index: -300;
}
.sort-right-right
{
background-color: #ebebeb;
height: 474px;
width: 254px;
background-color: #ebebeb;
position: absolute;
right: 0;
z-index: -600;
}
.top-box
{
width:auto;
height: 138px;
}
.bottom-box
{
height: 323px;
width:auto;
}
.top-box-top
{
height: 70px;
width:auto;
}
.top-box-bottom
{
height: 70px;
width: auto;
}
.box-top-img
{
display: block;
width: 50px;
height: 50px;
float: left;
margin-left: 10px;
margin-top: 10px;
}
.top-box-top-inner
{
width: 125px;
height: 38px;
float: right;
margin-top:15px;
}
.top-box-top-p
{
font-size: 12px;
color:#333;
display: block;
}
.top-inner-inner
{
font-size: 12px;
color: #333;
text-decoration: none;
}
.top-inner-inner:hover
{
color:#e65c00;
}
.p-em
{
font-style: normal;
}
.kehu
{
display: block;
width: 156px;
height: 24px;
background-color: #ff8000;
margin:0 auto;
text-decoration: none;
color:#fff;
margin-top: -2px;
border-radius: 3px;
text-align: center;
line-height: 24px;
font-size: 12px;
}
.super
{
display: block;
width: 156px;
height: 24px;
background-color: #1a165e;
margin:0 auto;
text-decoration: none;
color:#fada99;
margin-top: 10px;
border-radius: 3px;
text-align: center;
line-height: 24px;
font-size: 12px;
}
.bottom-box-link
{
height:85px;
width: 196px;
}
.bottom-box-link-a
{
width: 65px;
height: 85px;
display: block;
float: left;
text-decoration: none;
}
.bottom-box-img
{
width: 26px;
height: 26px;
margin:6px auto;
display: block;
}
.bottom-box-img.addition
{
width: 36px;
height: 36px;
}
.bottom-box-p
{
height: 20px;
max-width: 66px;
line-height: 20px;
font-size: 14px;
color: #333;
text-align: center;
}
.banner-center
{
width: 791px;
height: 112px;
background-color: transparent;
position: absolute;
bottom: 7px;
left: 450px;
z-index: 0;
}
.banner-center-img
{
width: 194px;
height: 112px;
}
1053
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
