体系课

回到首页 个人中心 反馈问题 注册登录
下载APP
首页 课程 实战 体系课 手记 专栏 慕课教程

5-2作业问题

来源：5-2 作业题

慕田峪0316891

2018-08-17 10:48:30

<!DOCTYPE html>
<htm>
<head>
	<meta charset="UTF-8">
	<title>幕淘网</title>
	<link rel="stylesheet" type="text/css" href="css/style001.css">
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
	<script type="text/javascript" src="js/script001.js"></script>
</head>
<body>
	<!--top-->
<div class="head">
<div class="top">
<span style="color: red;" id="dl">亲，请登录</span><span>免费注册</span><span>手机逛慕淘</span>
<div id="aa"><img src="../image/icon/22.png">联系客服<ul><li>消费者客服</li><li>卖家客服</li></ul></div>
<div id="aa" class="sod"><img src="../image/icon/22.png">卖家中心<ul><li>免费开店</li><li>已卖出的宝贝</li><li>出售中的宝贝</li><li>卖家服务市场</li><li>卖家培训中心</li><li>体验中心</li></ul></div>
<div id="aa">商品分类</div>
<div id="aa" class="mm"><img src="../image/icon/22.png">收藏夹<ul><li>收藏的宝贝</li><li>收藏的店铺</li></ul></div>
<div id="aa" class="nn"><img src="../image/icon/22.png">我的慕淘<ul><li>已买到的宝贝</li><li>我的足迹</li></ul></div>
</div>
<hr/ style="width: 1230px; margin: auto;color:#F5F5F5">

<!--logo-->
<div class="logo">
<img src="../image/logo.png">
<input type="text" name="123" placeholder="灵魂美食一元抢" id="ss">
<button type="submit" id="bs">搜索</button>
<div id="car"><img src="../image/icon/26.png" id="p1">购物车&nbsp;&nbsp;|&nbsp;&nbsp;0<img src="../image/icon/23.png" id="p2"></div>
<div class="things">
<p>最新加入的商品</p>
<hr/ style = "margin: 15px 20px 0 20px;">
<div class="list">
<div>
<img src="../image/cart/1.png" class="pq">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;adidas&nbsp;阿迪达斯&nbsp;男士训练服<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<p class="jg">￥335×1</p><hr/ style = "margin: 10px 0 10px 20px;">
</div>
<div>
<img src="../image/cart/2.png" class="pq">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;adidas&nbsp;阿迪达斯&nbsp;男士训练服<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<p class="jg">￥335×1</p><hr/ style = "margin: 12px 000 10px 20px">
</div>
<div>
<img src="../image/cart/3.png" class="pq">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;adidas&nbsp;阿迪达斯&nbsp;男士训练服<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<p class="jg">￥335×1</p><hr/ style = "margin: 12px 000 5px 20px">
</div>
<div>
<img src="../image/cart/4.png" class="pq">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;adidas&nbsp;阿迪达斯&nbsp;男士训练服<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<p class="jg">￥335×1</p><hr/ style = "margin: 12px 000 5px 20px">
</div>
<div>
<img src="../image/cart/5.png" class="pq">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;adidas&nbsp;阿迪达斯&nbsp;男士训练服<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<p class="jg">￥335×1</p><hr/ style = "margin: 12px 00 5px 20px">
</div>
<div>
<img src="../image/cart/book.jpg" class="pq">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;adidas&nbsp;阿迪达斯&nbsp;男士训练服<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<p class="jg">￥335×1</p><hr/ style = "margin: 12px 00 5px 20px">
</div>
<div>
<img src="../image/cart/2.png" class="pq">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;adidas&nbsp;阿迪达斯&nbsp;男士训练服<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<p class="jg">￥335×1</p><hr/ style = "margin: 12px 00 5px 20px">
</div>
<div>
<img src="../image/cart/3.png" class="pq">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;adidas&nbsp;阿迪达斯&nbsp;男士训练服<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<p class="jg">￥335×1</p><hr/ style = "margin: 12px 00 5px 20px">
</div>
<div>
<img src="../image/cart/4.png" class="pq">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;adidas&nbsp;阿迪达斯&nbsp;男士训练服<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<p class="jg">￥335×1</p><hr/ style = "margin: 12px 0 5px 20px">
</div>
<div>
<img src="../image/cart/5.png" class="pq">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;adidas&nbsp;阿迪达斯&nbsp;男士训练服<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<p class="jg">￥335×1</p><hr/ style = "margin: 12px 0 5px 20px">
</div>
</div>
<p class="zj">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;共27件商品，共计￥0.00
<button type="">去购物车</button>
</p>
</div>
</div>
</div>
<!--导航区-->
<div class="dao">
<div class="word">
<a href="#">数码城</a>
<a href="#">天黑黑</a>
<a href="#">团购</a>
<a href="#">发现</a>
<a href="#">二手特价</a>
<a href="#">名品汇</a>
</div>
</div>
<!--banner区-->
<div class="containor">
<div class="nav_left">
<ul>	
<li>&nbsp;&nbsp;&nbsp;<img src="../image/icon/18.png" class="shoplisttitleimg"/>&nbsp;&nbsp;商品分类</li>
<li data-id="1"> <span>美妆/个人护理</span></li>
<li data-id="2"> <span>手机 /数码 /电脑办公</span></li>
<li data-id="3"> <span>零食 /茶酒 /进口食品 </span></li>
<li data-id="4"> <span>母婴玩具 </span></li>
<li data-id="5"> <span>腕表 /眼镜 /珠宝饰品 </span></li>
<li data-id="6"> <span>大家电 /生活电器 </span></li>
<li data-id="7"> <span>厨具 /收纳 /宠物  </span></li>
<li data-id="8"> <span>汽车 /配件 /用品  </span></li>
<li data-id="9"> <span>生鲜水果  </span></li>
<li data-id="10"> <span>家纺 /家饰 /鲜花   </span></li>
<li data-id="11"> <span>营养保健 </span></li>
</ul>
</div>
<div class="nav_right">
<div class="sub hide" data-id="1">
<dl>
<dt><a >护肤品 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >彩妆 <i> &gt;</i></a> </dt>
<dd>
<a>时尚彩妆</a>
<a>香水</a>
<a>气垫护肤</a>
<a>BB霜</a>
<a>口红</a>
<a>隔离</a>
<a>粉底</a>
<a>粉饼</a>
</dd>
</dl>
<dl>
<dt><a >男士护肤 <i> &gt;</i></a> </dt>
<dd>
<a>洁面爽</a>
<a>面膜</a>
<a>护肤套装</a>
<a>肤水乳液/面霜</a>
<a>精华液</a>
<a>眼部护理</a>
<a>面膜</a>
<a>唇部护理</a>
<a>防晒</a>
<a>精华液</a>
<a>T区护理控油</a>
</dd>
</dl>
<dl>
<dt><a >护肤品 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >彩妆 <i> &gt;</i></a> </dt>
<dd>
<a>时尚彩妆</a>
<a>香水</a>
<a>气垫护肤</a>
<a>BB霜</a>
<a>口红</a>
<a>隔离</a>
<a>粉底</a>
<a>粉饼</a>
</dd>
</dl>
<dl>
<dt><a >男士护肤 <i> &gt;</i></a> </dt>
<dd>
<a>洁面爽</a>
<a>面膜</a>
<a>护肤套装</a>
<a>肤水乳液/面霜</a>
<a>精华液</a>
<a>眼部护理</a>
<a>面膜</a>
<a>唇部护理</a>
<a>防晒</a>
<a>精华液</a>
<a>T区护理控油</a>
</dd>
</dl>
</div>
<div class="sub hide" data-id="2">
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
</div>
<div class="sub hide" data-id="3">
<dl>
<dt><a >进口食品 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>饼干</a>
<a>海苔</a>
<a>火腿肠</a>
<a>方便面</a>
<a>果冻</a>
<a>水果干</a>
<a>坚果</a>
<a>面包蛋糕</a>
<a>华夫饼</a>
<a>进口巧克力</a>
<a>进口咖啡</a>
<a>进口葡萄酒</a>
<a>啤酒饮料</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
</div>
<div class="sub hide" data-id="4">
<dl>
<dt><a>母婴玩具 <i> &gt;</i></a> </dt>
<dd>
<a>童装</a>
<a>秋换新</a>
<a>商场同款</a>
<a>特价优惠</a>
<a>秋衣秋裤</a>
<a>外套</a>
<a>羽绒服</a>
<a>夹克</a>
<a>连衣裙</a>
<a>裤子</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
</div>
<div class="sub hide" data-id="5">
<dl>
<dt><a >珠宝饰品 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
</div>
<div class="sub hide" data-id="6">
<dl>
<dt><a >生活电器 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>生活电器</a>
<a>生活电器</a>
<a>吹风机</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl></div>
<div class="sub hide" data-id="7">
<dl>
<dt><a >厨具 <i> &gt;</i></a> </dt>
<dd>
<a>厨具</a>
<a>厨具</a>
<a>油烟机</a>
<a>洗碗机</a>
<a>电磁炉</a>
<a>微波炉</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
</div>
<div class="sub hide" data-id="8">
<dl>
<dt><a >汽车 <i> &gt;</i></a> </dt>
<dd>
<a>汽车</a>
<a>汽车</a>
<a>汽车</a>
<a>汽车</a>
<a>汽车</a>
<a>汽车</a>
<a>汽车</a>
<a>汽车</a>
<a>汽车</a>
<a>汽车</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
</div>
<div class="sub hide" data-id="9">
<dl>
<dt><a >生鲜水果 <i> &gt;</i></a> </dt>
<dd>
<a>火龙果</a>
<a>苹果</a>
<a>榴莲</a>
<a>进口水果</a>
<a>优惠活动</a>
<a>雪梨</a>
<a>山竹</a>
<a>葡萄</a>
<a>泰国芒果</a>
<a>柚子</a>
<a>马蹄</a>
<a>橘子</a>
<a>香蕉</a>
<a>猕猴桃</a>
<a>椰子</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
</div>
<div class="sub hide" data-id="10">
<dl>
<dt><a >当季热卖 <i> &gt;</i></a> </dt>
<dd>
<a>定制窗帘</a>
<a>抱枕</a>
<a>被子</a>
<a>两用坐垫</a>
<a>国际家纺床品</a>
<a>国际居家布艺</a>
<a>国际家居饰品</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
</div>
<div class="sub hide" data-id="11">
<dl>
<dt><a >保健品 <i> &gt;</i></a> </dt>
<dd>
<a>111</a>
<a>1111</a>
<a>11111</a>
<a>111111</a>
<a>1111111</a>
<a>11111111</a>
<a>111111111</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
<dl>
<dt><a >电脑办公 <i> &gt;</i></a> </dt>
<dd>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
<a>官方直售</a>
<a>面膜</a>
<a>护肤套装</a>
<a>乳液面霜</a>
<a>精华液</a>
</dd>
</dl>
</div>
 <!--图片轮播-->
   <div class="bannerbox">
         <div class="banner" id="banner">

              <a href="">
                   <div class="banner-slide slide1 slide-active"><img src="../image/focus-carousel/1.png"/></div>
              </a>
              <a href="">
                   <div class="banner-slide slide2"><img src="../image/focus-carousel/2.jpg"/></div>
              </a>
               <a href="">
                   <div class="banner-slide slide3"><img src="../image/focus-carousel/3.jpg"/></div>
               </a>
               <a href="">
                    <div class="banner-slide slide4"><img src="../image/focus-carousel/4.jpg"/></div>
               </a>
               <a href="">
                    <div class="banner-slide slide5"><img src="../image/focus-carousel/5.jpg"/></div>
               </a>
                <a href="javascript:void(0)" class="button prev" id="prev"><img src="../image/focus-carousel/pre2.png"/></a>
                <a href="javascript:void(0)" class="button next" id="next"><img src="../image/focus-carousel/pre.png"/></a>
                <div class="dots" id="dots">
                      <span class="active"></span>
                      <span></span>
                      <span></span>
                      <span></span>
                      <span></span>
                </div>
        </div>
    </div>
    <!--生活服务-->
    <div class="life">
        <!--幕快报-->
        
        <div class="mukuaibao">
            <div class="mukuaibaotitle" style="color:red;font-size:25px";>幕快报<span style="color:#A9A9A9;">更多 &nbsp;></span>
            </div>
            <div class="mkb">
                    <p><a href="">[特惠]精选图书每满150减50</a></p>
                    <p><a href="">[公告]广州图书仓搬仓升级配送延迟</a></p>
                    <p><a href="">[特惠]爆款手机12期免息&nbsp;抽奖赢电视</a></p>
                    <p><a href="">[公告]广东、福建受台风影响配送延迟</a></p>
                    <p><a href="">[特惠]大闸蟹领劵满399减180</a></p>
            </div>
        </div>
        <!--图标区-->
        <div class="iconimg" style="color:#A9A9A9">
            <dl>
                <dt><img src="../image/icon/1.png"/></dt>
                <dd>话费</dd>
            </dl>
            <dl>
                <dt><img src="../image/icon/2.png"/></dt>
                <dd>机票</dd>
            </dl>
            <dl>
                <dt><img src="../image/icon/3.png"/></dt>
                <dd>电影票</dd>
            </dl>
            <dl>
                <dt><img src="../image/icon/4.png"/></dt>
                <dd>游戏</dd>
            </dl>
            <dl>
                <dt><img src="../image/icon/5.png"/></dt>
                <dd>彩票</dd>
            </dl>
            <dl>
                <dt><img src="../image/icon/6.png"/></dt>
                <dd>加油卡</dd>
            </dl>
            <dl>
                <dt><img src="../image/icon/7.png"/></dt>
                <dd>酒店</dd>
            </dl>
            <dl>
                <dt><img src="../image/icon/8.png"/></dt>
                <dd>火车票</dd>
            </dl>
            <dl>
                <dt><img src="../image/icon/9.png"/></dt>
                <dd>众筹</dd>
            </dl>
            <dl>
                <dt><img src="../image/icon/10.png"/></dt>
                <dd>理财</dd>
            </dl>
            <dl>
                <dt><img src="../image/icon/11.png"/></dt>
                <dd>礼品卡</dd>
            </dl>
            <dl>
                <dt><img src="../image/icon/12.png"/></dt>
                <dd>白条</dd>
            </dl>
        </div>
             <div class="iconad">
                  <img src="../image/ad.png"/>
             </div>
     </div> 
</div>
</div>
</div>
<!--登录注册页面-->
<div class="zhez"></div>
<div class="neir">
<div class="word"><span class="ab" id="ab">登录</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="bb">注册</span></div>
<div class="dl">
<form>
<input type="text" name="1" placeholder="请输入登录邮箱/手机号" id="un"><br/>
<p class="erro1"></p>
<input type="password" name="2" placeholder="6-16位密码,区分大小写,不能用空格" id="pas"><br/><p class="erro2"></p>
<input type="checkbox" name="3" class="aa"><div class="dx">下次自动登录</div>
<div class="fp">忘记密码</div>
<input type="button" id="sub1" value="登录">
</form>
<div class="pics">
<img src="../image/icon/xinlang.png">
<img src="../image/icon/weixin.png">
<img src="../image/icon/QQ.png">
</div>
</div>
<div class="zc">
<form>
<input type="text" name="1" placeholder="请输入注册邮箱/手机号" id="zc"><br/>
<p class="erro3"></p>
<input type="text" name="2" style = "width: 210px;" placeholder="请输入验证码" id="get"><img src="../image/verify.png" id="yzm"><br/>
<p class="erro4"></p>
<input type="button" id="sub2" value="注册">
</form>
<div class="pics">
<img src="../image/icon/xinlang.png">
<img src="../image/icon/weixin.png">
<img src="../image/icon/QQ.png">
</div>
</div>
<div class="guan">×</div>
</div>
</body>
</html>
*{
    margin: 0; 
    padding: 0;
}
.head{
    width: 100%;
    height: 180px;
    background-color: #F5F5F5;
}
body{
    font: 14px/1.5 "微软雅黑",Verdana,Tahoma,Arial,sans-serif,"宋体";
}

/*top*/
.top{
    width: 1200px;
    height: 20px;
    margin: auto;
    margin-bottom: 16px;
    font-size: 13px;
    position: relative;
}
.top span{
    display: inline-block;
    margin:10px 7px 0 7px;
}
.top span:hover{
    color: red;
    cursor: pointer;
}
.top #aa{
    width: 80px;
    text-align: center;
    padding: 9px 4px;
    float: right;
    border: 1px transparent solid;
    border-bottom: none;
    border-top: none; 
}
.top #aa ul{
    display: none;
    border: 1px lightgray solid;
    list-style: none;
    color: black;
    font-size: 13px;
    position: absolute;
    height: 70px;
    width: 85px;
    z-index: 999;
    background-color: white;
    border-top: none;
    margin-top: 10px;
    margin-left: -5px;
    padding: 0 1.5px;
}
.top #aa ul li{
    text-align: center;
    line-height: 35px;
    margin-left: -2px !important;
    padding-right: 2px;
    width: 87px;
    height: 35.5px;
}
.top #aa ul li:hover{
    background: #cdd0d4;
}
.top #aa:hover{
    color: red;
    cursor: pointer;
    background-color: #fff;
    border: 1px lightgray solid;
    border-bottom: none;
    border-top: none;
}
.top #dl{
    cursor: pointer;
}
.top #aa img{
    float: right;
    margin-right: 5px;
    margin-top: 2px;
}

 /*logo区*/
.logo{
    width: 1200px;
    height: 130px;
/*  border: 1px red solid;*/
    margin:auto;
    position: relative;
}
.logo img{
    position: absolute;
    margin-top: 41px;
}
.logo #ss{
    margin:47.5px 260px;
    width: 600px;
    height: 35px;
    position: absolute;
}
.logo #bs{
    margin-left: 860px;
    margin-top: 47.5px;
    width: 100px;
    height: 39.5px;
    background-color: black;
    color: white;
    border: 0;
}
.logo #car{
    width: 150px;
    height: 39px;
    background-color: red;
    color: white;
    margin-left: 1045px;
    margin-top:-40px;
    display: block;
    text-align: center;
    line-height: 39px;
}
.logo #car:hover{
    cursor: pointer;
    border: 1px lightgray solid;
    border-bottom: none;
}
.logo #car #p1{
    display: inline;
    float: left;
    margin:11px -27px;
}
.logo #car #p2{
    display: inline;
    float: right;
    margin:11px 10px;
}
.logo .things{
    width: 300px;
    height: 445px;
    color: black;
    margin-left: 1000px;
    background-color: white;
    border: 1px lightgray solid;
    display: none;
}
.logo .things p{
    margin-top: 10px;
    margin-left: 30px;
}
.logo .things .list{
    width: 300px;
    height: 335px;
    overflow: scroll;
    overflow-x: hidden;
}
.logo .things .list div{
    font-size: 12px;
    width: 280px;
    height: 56px;
    position: relative;
    /*margin: auto;*/
    padding-top: 10px;
    /*border: 1px green solid;*/
}
.logo .things .list div:hover{
    background-color: #f3f5f7;
    color: red;
}
.logo .things .list .jg{
    width: 50px;
    height: 15px;
    margin-top: -3px;
    margin-left: 80px;
}
.logo .things .list .pq{
    display: inline-block;
    margin-left: 20px;
    margin-top: 0 !important;
}
.logo .things .zj{
    margin: 0 !important;
    height: 60px;
    width: 200px;
    line-height: 60px;
    display: inline;
    font-size: 13px;
}
.logo .things .zj button{
    background-color: red;
    color: white;
    width: 90px;
    height: 40px;
    margin-left: 20px;
    border: none;
    display: inline-block;
}
 /*导航区*/
.dao{
    background-color: #07111b;
    width: 100%;
    height: 50px;
}

.dao .word{
    width: 600px;
    height: 50px;
    margin-left: 530px;
    text-align: center;
    line-height: 50px;
}

.dao .word a{
    text-decoration: none;
    margin:0 25px;
    color: #f3f5f7;
}
.dao .word a:hover{
    color: red;
}
.bigbanner{
    width:1200px;
    height:550px;
    margin:0 auto;

}
.banner, .life{
    float:left;
}
.show{
    display:block;
}

/*商品分类区*/
ul{
margin: 0;
padding: 0;
list-style-type: none;
}
a{
text-decoration: none;
}
.containor {
width: 1000px;
height: auto;
position: relative;
z-index: 9999;
margin: 0 auto;
top:-50px;
margin-left:360px;

}
.nav_left {
width: 200px;
height: 600px;
background-color:rgba(255,0,0 ,0.8)
}
.nav_left ul {
width: 100%;
}
.nav_left ul li {
height: 50px;
line-height: 50px;
text-align: left;
}
.nav_left ul li span {
padding-left: 10px;
height: 50px;
line-height:50px;
display: block;
background: #FF0036;
color: white;
}
.nav_left ul li span:hover {
color: #FF0036;
background: #FFFFFF;
}
.nav_right {
width: 700px;
height: 509px;
position: absolute;
z-index: 9999;
margin-left:200px;
top:50px;
}
.sub {
position: relative;
width: 100%;
height: 530px;
background: #FFFFFF;
padding: 10px 0px;
}
.sub dl {
overflow: hidden;
padding: 0px 0px 10px 0px;
}
.sub dt {
width: 100px;
float: left;
display: block;
position: relative;
clear: left;
}
.sub dt a {
font-size: 14px;
color: #000;
font-weight: bold;
text-align: center;
padding-left: 20px;
text-decoration: none;
cursor: pointer;
}
.sub dt i {
width: 4px;
right: 12px;
top: 2px;
font-size: 14px;
position: absolute;
font-style: normal;
}
.sub dd {
width: 680px;
float: left;
display: block;
position: relative;
overflow: hidden;
padding-right: 20px;
border-bottom: 1px dashed #E3E3E3;
}
.sub dd a {
font-size: 12px;
float: left;
color: #666;
padding: 0 10px;
margin: 4px 0px 10px 0px;
text-decoration: none;
cursor: pointer;
border-left: 1px solid #E3E3E3;
}
.sub dd a:hover {
color: #FF0036;
}
.hide {
display: none;
}
.show {
display: block;
}
.logosearch{
margin-top:35px;
}
/*banner的图片轮播*/
.bannerbox{
    width:700px;
    height:510px;
    overflow:hidden;
}

.banner{
    width:700px;
    height:510px;
    position: relative;
    margin:10px 10px 0px 10px ;
}

.banner-slide img{
    width:700px;
    height:500px;
}

.banner-slide{
    width:700px;
    height:510px;
    background-repeat:no-repeat;
    float:left;
    display: none;
    overflow: hidden;
}

.slide-active{
    display:block;
}

.button{
    position: absolute;
    top: 45%;
    overflow: hidden;
    width: 40px;
    height:30px;
}

.button img{
    width:10px;
    margin-left:10px;
    margin-top:5px;
}

.prev{
    margin-left:-700px;
}

.next{
    margin-left:-50px;
    
}

.button:hover{
    background-color:#333;
    opacity: 0.8;
    filter:alpha(opacity=80);
}

.dots {
    position: absolute;
    bottom: 0;
    right: 0;
    text-align: center;
    padding-right: 24px;
    line-height: 12px;
    margin-right:270px;
    margin-bottom:20px;
}

.dots span {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-left: 8px;
    background-color: rgba(7,17,27,0.4);
    cursor: pointer;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.8) inset;
}

.dots span .active{
    box-shadow: 0 0 0 2px rgba(7, 17, 27, 0.4) inset;
    background-color: #F8F8FF;
}
/*慕课报*/
.life{
    height: 500px;
    position:absolute;
    margin-left:900px;
    margin-top:-500px;
    width:300px;
    background:#fff;

}
.mukuaibao{
    width:290px;
    text-indent:2em;
    height:180px;
    line-height:25px;
    border: 1px solid #e0e0e0;
    border-bottom:none;
}
.mukuaibaotitle{
    height: 50px;
    font-size:16px;
    line-height: 50px;
    color:red;
}
.mukuaibaotitle span{
    display:block;
    position: absolute;
    margin-left:200px;
    margin-top:-50px;
    color:#333;
    font-size:14px;
}
.mkb a:hover{
    color:red;
}
.iconimg{
    height: 200px;
    width:300px;
}

dl:nth-child(4n){
    border-right:1px solid #e0e0e0;
}
.iconimg dl{
    width:72px;
    height:63px;
    float:left;
    border-top:1px solid #e0e0e0;
    border-left:1px solid #e0e0e0;
    text-align:center;
    padding-top:15px;
}
.iconimg img{
    width:20px;
    height:20px;
}
.iconad img{
    height: 80px;
    width:292px;
}

/*登录注册页面*/
.zhez{
    width: 100%;
    height: 100%;
    background-color: black;
    opacity: 0.5;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    display: none;
}
.neir{
    width: 450px;
    height: 370px;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    background-color: white;
    z-index: 999999;
    display: none;
}
.neir .guan{
    width: 20px;
    height: 20px;
    background-color: white;
    text-align: center;
    line-height: 20px;
    float: right;
    margin-top: -380px;
    right: 43px;
    cursor: pointer;
    font-size: 26px;
    position: absolute;
    color: lightgray;
    display:none;
}
.neir .guan:hover{
    color: black;
}
.neir .word{
    width: 160px;
    height: 50px;
    color: gray;
    text-align: center;
    margin-top: 40px;
    font-size: 20px;
    margin-left: 20px;
}
.ab{
    color: red;
    padding-bottom: 3px;
    border-bottom: 2px solid red;
}
.neir .word span:hover{
    cursor: pointer;
}
.neir .dl{
    font-size: 13px;
    color: gray;
}
.neir .dl .erro1{
    float: left;
    height: 30px;
    left:  50px;
    top: 140px;
    color: red;
    position: absolute;
}
.neir .dl .erro2{
    float: left;
    height: 30px;
    left:  50px;
    top: 200px;
    color: red;
    position: absolute;
}
.neir .dl input{
    display: block;
    width: 350px;
    height: 35px;
    margin: 5px 50px;
    position: relative;
}
 .neir .dl .aa{
    width: 13px;
    height: 13px;
    margin-top: 2px;
    display: inline-block;
}
.neir .dl .dx{
    margin-top: -23px;
    margin-left: 65px;
}
.neir .dl .fp{
    width: 60px;
    height: 30px;
    float: right;
    margin-top: -17px;
    margin-right: 37px;
}
.neir .dl #sub1{
    width: 354px;
    height: 40px;
    background-color: red;
    font-size: 20px;
    border: none;
    margin-left: 50px;
    color: white;
}
.neir .dl .pics{
    width: 350px;
    height: 100px;
    margin-left: 70px;
    margin-top: 20px;
}
.neir .dl .pics img{
    width: 38px;
    height: 38px;
    margin: -6px 30px;
    border-radius: 19px;
    background-color: gray;
}
.neir .dl .pics img:hover{
    background-color: green;
    cursor: pointer;
}
.neir .zc{
    font-size: 13px;
    color: gray;
}
.neir .zc .erro3{
    float: left;
    height: 30px;
    left:  50px;
    top: 140px;
    color: red;
    position: absolute;
}
.neir .zc .erro4{
    float: left;
    height: 30px;
    left:  50px;
    top: 200px;
    color: red;
    position: absolute;
}
.neir .zc input{
    display: block;
    width: 350px;
    height: 35px;
    margin:5px 50px;
    position: relative;
}
.neir .zc #sub2{
    width: 354px;
    height: 40px;
    background-color: red;
    font-size: 20px;
    border: none;
    margin-left: 50px;
    color: white;
    position: relative;
}
.neir .zc .pics{
    width: 350px;
    height: 100px;
    margin-left: 70px;
    margin-top: 20px;
}
.neir .zc .pics img{
    width: 38px;
    height: 38px;
    margin: auto 30px;
    border-radius: 19px;
    background-color: gray;
}
.neir .zc .pics img:hover{
    background-color: green;
    cursor: pointer;
}
.neir .zc #yzm{
    display: inline-block;
    position: absolute;
    width: 124px;
    height: 40px;
    margin-left: 280px;
    margin-top: -44px;
}
.zcactive{
    color: red;
    padding-bottom: 3px;
    border-bottom: 2px solid red;
}

.btm{
   width:1200px;
   text-align:center;
   margin:0 auto;
   margin-top:30px;
   margin-bottom:30px;
}


老师我这段代码是哪里错了呢

写回答

2回答

好帮手慕夭夭

2018-08-17

已采纳

如下 :

http://img.mukewang.com/climg/5b76390b0001534216720724.jpg

建议给红框的内容放在一个div中 ,并设置宽度1200px ,使用margin:0 auto实现居中效果 . 

如下侧栏和banner区域以及右边信息栏 高度要保持一致 

http://img.mukewang.com/climg/5b7639c80001211315880173.jpg

如下按钮:

需要设置   cursor: pointer;

http://img.mukewang.com/climg/5b76393200019c1501970094.jpg


因为同学还没有做完 ,所以不知道是不会还是没做完 , 不能更好的批复 . 建议同学把作业完善后在作业区域提交作业 . 会有专业的老师针对问题进行指导的哦

祝学习愉快 ,望采纳

0

慕田峪0316891

提问者

2018-08-17


/**登录注册**/
$(function(){
    $('#dl').click(function(event) {
        $('.zhez').css({'display': 'block'});
        $('.neir').css({'display': 'block'});
        $('.guan').css({'display': 'block'});
        $('.zc').css({'display': 'none'});
        $('.dl').css({'display': 'block'});
        $('.neir').css({'height': 355});
        $('#bb').removeClass('zcactive');
        $('.guan').css({'margin-top': -365});
        $('#ab').addClass('ab');
 
    });
 
    $('.guan').click(function(event) {
        $('.zhez').css({'display': 'none'});
        $('.neir').css({'display': 'none'});
        $('form').children('p').html("");
        $('#un').val("");
        $('#pas').val("");
        $('#zc').val("");
        $('#get').val("");
    });
 
    $('#bb').click(function(event) {
        $('.zc').css({'display': 'block'});
        $('.dl').css({'display': 'none'});
        $('.neir').css({'height': 340});
        $(this).addClass('zcactive');
        $('.ab').removeClass('ab');
        $('.guan').css({'margin-top': -340});
    });
    $('.ab').click(function(event) {
        $('.dl').css({'display': 'block'});
        $('.zc').css({'display': 'none'});
        $('.neir').css({'height': 355});
        $(this).addClass('ab');
        $('#bb').removeClass('zcactive');
        $('.guan').css({'margin-top': -365});
    });
 
    $('#sub1').click(function(event) {
        var uname = $('#un').val();
        var upass = $('#pas').val();
        var koge = /(^\s*)|(\s*$)/g;
        if(!uname.match(/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/)){
            $('.erro1').html("格式不正确！请重新输入");
        }else if (uname.length != 11 || isNaN(uname)) {
            $('.erro1').html("格式不正确！请重新输入");
        }else{
            $('.erro1').html("用户名输入正确！");
        }
        if(upass.length < 6 || upass.length > 16){
            $('.erro2').html("密码输入错误！");
        }else if (koge.test("upass")) {
            $('.erro2').html("密码中不能有空格！");
        }else{
            $('.erro2').html("密码输入正确！");
        }
    });
    $('#sub2').click(function(event) {
        var zuname = $('#zc').val();
        var yamval = $('#get').val();
        var m = /^[a-zA-Z]+$/;
        if(!zuname.match(/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/)){
            $('.erro3').html("格式不正确！请重新输入");
        }else if (zuname.length != 11 || isNaN(zuname)) {
            $('.erro3').html("格式不正确！请重新输入");
        }else{
            $('.erro3').html("用户名输入正确！");
        }
        if(!m.test(yamval)){
            $('.erro4').html("验证码输入错误！");
        }else {
            $('.erro4').html("验证码输入正确！");
        }
    });
 
    $('#aa').mouseover(function() {
        $('#aa').children('ul').css({'display': 'block'});
    });
    $('#aa').mouseout(function(event) {
        $('#aa').children('ul').css({'display': 'none'});
    });
    $('.sod').mouseover(function() {
        $('.sod').children('ul').css({'display': 'block'});
        $('.top > .sod > ul').css({
            'height': 213,
        })
        $('.top > .sod > ul > li').css({
            'margin-left': 0,
            'margin-right': 0,
        })
    });
    $('.sod').mouseout(function(event) {
        $('.sod').children('ul').css({'display': 'none'});
    });
    $('.mm').mouseover(function() {
        $('.mm').children('ul').css({'display': 'block'});
    });
    $('.mm').mouseout(function(event) {
        $('.mm').children('ul').css({'display': 'none'});
    });
    $('.nn').mouseover(function() {
        $('.nn').children('ul').css({'display': 'block'});
        $('.top > .nn > ul > li').css({
            'margin-left': 0,
            'margin-right': 0
        })

    $('.nn').mouseout(function(event) {
        $('.nn').children('ul').css({'display': 'none'});
        });
    });
0

0 学习 · 36712 问题

查看课程

相似问题

关于5-2的作业题

回答 1

5-2作业题

回答 2

5-2作业问题

回答 1

5-2问题

回答 1

5-2作业求救

回答 4

打开慕课网App查看更多内容