<style> *{margin:0;padding:0} li{list-style:none} a{text-decoration:none} #wrapper{font: 12px/1.5 tahoma,arial,"\5b8b\4f53";} div#top-nav{height:40px;background:#f2f2f2;border-bottom:1px solid #e1e1e1;padding:0 60px;color:#999} div#top-nav nav ul{float:right;width:65%;text-align:center} div#top-nav nav ul li {display:inline-block;list-style:none;position:relative;} div#top-nav nav ul li a{margin:0 15px;line-height:40px} div#top-nav>span{float:left;line-height:40px;} div#top-nav span>a{padding:0 10px;} div#top-nav nav ul li.sj:after{position:absolute;top:50%;left:80%;content:"";border-width:5px;border-style:solid;border-color:#888 transparent transparent transparent} div#top-nav nav ul li ul{display:none; position:absolute;top:40%;left:1%;border:1px solid;padding:10px 10px 0 5px} div#top-nav nav ul li ul li{width:11em;} div#top-nav nav ul li ul li a{display:block;} div#top-nav nav ul li:hover>ul{display:block;border-top:none} header{background:#fff;height:130px} header h1{padding:0 60px;color:red;float:left;width:20%} header >div{float:right;width:66%;} header form{border:solid red;width:50%;margin:50px 0 0 ;height:36px;position:relative} header form input:nth-child(1){width:75%;height:100%;border:0} header form input:nth-child(2){width:25%;height:100%;font-size:18px;font-weight:700;letter-spacing: 5px; background:red;position:absolute;top:0;right:0;border:0} header nav li{float:left;height:20px;} header nav ul {margin-left:-10px;width:60%} header nav ul li a{margin:0 10px 0;text-decoration:none;} header nav ul li+li{border-left:1px solid;color:#999} #main{position:relative;border:1px solid red;height:536px;width:100%} #main-nav {height:36px;border:1px solid;position:absolute;top:0;right:0;width:100%;background:red;z-index:2; } #main-nav a{line-height:36px;color:white;font-size:1.5em;margin:0 15px } #main-nav div{margin-left:200px;text-align:center;} #main section >div.item{position:absolute;height:36px;font-size:1.5em;margin-left:60px; line-height:36px;color:white;z-index:3;} #main section ul.normal-nav{background-color:rgba(238,238,238,.95);top:36px;position:relative;left:0; z-index:20;width:180px;height:500px;margin-left:60px;border:1px solid;} #main section ul li {height:31px;line-height:31px;font-size:14px;color:#111;position:relative} #main section ul li a{display:inline-block} #main section ul li:hover{background:#fff} #ba{position:absolute;z-index:-1;top:36px;left:0;width:100%;height:500px;border:1px solid #523;} #ba >img{width:100%;height:100%} footer {margin-bottom:0;border-top:1px solid #666666;background:#fff;position:relative} #ensure{height:100px;width:90%;margin:20px auto;padding:0} #ensure p{margin:10px 0;width:24%;height:100px;padding:0 0 0 5px ;margin:0;float:left;text-align:left;font-size:1.52em} #ensure p span:nth-child(1){font-size:2em;float:left;width:50px;height:50px;border:3px solid red;border-radius:25px;color:red} #extra{width:90%;border-top:1px solid #bbb;height:200px;padding-top:20px;margin:0 auto;} #extra ul{height:200px;width:20%;float:left;box-sizing:border-box;} #extra ul label{font-size:1.5em;} #extra ul li a{display:block;margin:6px 0 0 0 } #informations{color:#fff;width：100%; border-top:1px solid red;background:#000;height:200px;text-align:left;position:absolute;margin:15px 0 0 0} #informations p{margin-left:60px;padding:10px } </style> <div id="wrapper"> <div id="top-nav"> <span>喵，歡迎來天貓 <a href="#">請登錄</a><a href="#">免費注冊</a></span> <nav> <ul> <li class="sj"><a href="#">我的淘寶</a> <ul><li><a href="#">已買到的寶貝</a></li> <li><a href="#">已賣出的寶貝</a></li></ul> </li> <li><a href="#">我關注的品牌</a></li> <li><a href="#">購物車<span>0</span>件</a></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> </nav> </div> <header> <h1><a href="#">天貓</br>Tmall.com</a></h1> <div> <form> <input type="text"/> <input type="button" value="搜索"/> </form> <nav> <ul> <li><a href="#">t恤男</a></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> <li><a href="#">涼鞋</a></li> </ul> </nav> </div> </header> <div id="main"> <div id="main-nav"> <div> <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> <section> <div class="item">商品分類</div> <ul class="normal-nav"> <li> <a href="#">女裝</a> /<a href="#">內衣</a> </li> <li> <a href="#">男裝</a> /<a href="#">運動戶外</a> </li> <li> <a href="#">女鞋</a> /<a href="#">男鞋</a> / <a href="#">箱包</a> </li> <li> <a href="#">化妝品</a> /<a href="#">個人護理</a> </li> <li> <a href="#">腕表</a> /<a href="#">珠寶飾品</a> /<a href="#">眼鏡</a> </li> <li> <a href="#">手機</a> /<a href="#">數碼</a> /<a href="#">電腦辦公</a> </li> <li> <a href="#">母嬰玩具</a> </li> <li> <a href="#">零食</a> /<a href="#">進口食品</a> /<a href="#">茶酒</a> </li> <li> <a href="#">生鮮水果</a> </li> <li> <a href="#">大家電</a> /<a href="#">生活電器</a> </li> <li> <a href="#">家具建材</a> </li> <li> <a href="#">汽車</a> /<a href="#">配件</a> /<a href="#">用品</a> </li> <li> <a href="#">家紡</a> /<a href="#">家飾</a> /<a href="#">鮮花</a> </li> <li> <a href="#">醫葯保健</a> </li> <li> <a href="#">廚具</a> /<a href="#">收納</a> /<a href="#">寵物</a> </li> <li> <a href="#">圖書音像</a> </li> </ul> </section> <div id="ba"> <img src="file:///C:/Documents%20and%20Settings/Administrator/%E6%A1%8C%E9%9D%A2/000.jpg"/> <footer> <div id="ensure"> <p><span>優</span>品質保證<br><span class="p">品質護航 購物無憂</span></p> <p><span>七</span>七天無理由退換<br><span class="p">為您提供售后無憂保障</span></p> <p><span>特</span>特色服務體驗<br><span class="p">為您呈現不一樣的服務</span></p> <p><span>幫</span>幫助中心<br><span class="p">您的購物指南</span></p> </div> <div id="extra"> <ul> <label>購物指南</label> <li><a href="#">免費注冊</a></li> <li><a href="#">開通支付寶</a></li> <li><a href="#">支付寶充值</a></li> </ul> <ul> <label>天貓保障</label> <li><a href="#">發票保障</a></li> <li><a href="#">售后規則</a></li> <li><a href="#">缺貨賠付</a></li> </ul> <ul> <label>支付方式</label> <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> <ul> <label>商家服務</label> <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> <li><a href="#">喵言喵語</a></li> <li><a href="#">運營服務</a></li> </ul> <ul> <label>手機天貓</label> <img src="file:///C:/Documents%20and%20Settings/Administrator/%E6%A1%8C%E9%9D%A2/36.PNG" alt="二維碼"/> </ul> </div> <div id="informations"> <p> <a href="#">關於天貓</a> <a href="#" target="_blank" >幫助中心</a> <a href="#" target="_blank" >開放平台</a> <a href="#" target="_blank" >誠聘英才</a> <a href="#" target="_blank" >聯系我們</a> <a href="#" target="_blank" >網站合作</a> <a href="#" target="_blank" >法律聲明及隱私權政策</a> <a href="#" target="_blank" >知識產權</a> <a href="#" target="_blank" >廉正舉報</a> <a href="#">規則意見征集</a> </p> <p class="footer-otherlink"> <a href="http://www.alibabagroup.com/cn/global/home" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.34">阿里巴巴集團</a>| <a href="//www.taobao.com" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.35">淘寶網</a> | <a href="//www.tmall.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.36">天貓</a> | <a href="//ju.taobao.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.37">聚划算</a> | <a href="http://www.aliexpress.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.38">全球速賣通</a> | <a href="http://www.alibaba.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.39">阿里巴巴國際交易市場</a>| <a href="//www.1688.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.40">1688</a> | <a href="//www.alimama.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.41">阿里媽媽</a> | <a href="//www.fliggy.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.42">飛豬</a> | <a href="http://www.aliyun.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.43">阿里雲計算</a> | <a href="http://www.yunos.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.44">YunOS</a> | <a href="http://aliqin.cn/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.45">阿里通信</a> | <a href="http://www.net.cn/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.46">萬網</a> | <a href="http://www.autonavi.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.47">高德</a> | <a href="http://www.uc.cn/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.48">UC</a> | <a href="http://www.umeng.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.49">友盟</a> | <a href="http://www.xiami.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.50">蝦米</a> | <a href="http://www.alibabaplanet.com" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.51">阿里星球</a> | <a href="http://www.laiwang.com/" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.52">來往</a> | <a href="http://www.dingtalk.com/?lwfrom=20150205115110773" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.53">釘釘</a> | <a href="https://www.alipay.com" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.54">支付寶</a> </p> <p>增值電信業務經營許可證： <a href="#" >浙B2-20110446</a> 網絡文化經營許可證：<a href="#">浙網文[2015]0295-065號</a> <a href="#">12318舉報</a> <br> <span > 互聯網葯品交易服務資格證：<a href="//img.alicdn.com/tps/TB1c4YwOpXXXXcHXXXXXXXXXXXX-3306-2338.jpg" target="_blank" data-spm-anchor-id="875.7931836/B.a2226n1.58">粵c20150002</a> <a href="#"> <img src="https://img.alicdn.com/tps/TB1_qAKKVXXXXXjapXXXXXXXXXX-20-20.png">粵公網安備 44010602001483號 </a> <a href="#">粵ICP備14088652號-2</a> </span> <br>互聯網葯品信息服務資質證書編號：<a href="#">浙-（經營性）-2017-0005</a> <a href="#">浙公網安備 33010002000120號</a> <br> <b>© 2003-2017 TMALL.COM 版權所有</b> </p> </div> </footer> </div>