注册页面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<style>
a {
text-decoration: none;
}
header{
overflow: hidden;
}
header .one img{
width: 145px;
height: 55px;
float: left;
margin-left: 20px;
margin-top: 20px;
}
header .two{
float: right;
margin-right: 20px;
margin-top: 20px;
}
header p{
display: inline-block;
margin-right: 40px;
color: grey;
font-size: 13px;
font-weight: lighter;
}
header a{
border: 1px grey solid;
padding: 5px;
color: dodgerblue;
}
header p a{
border: none;
}
header p a:hover{
color: orangered;
}
header .two a:nth-child(2){
color: black;
}
header a span img{
position: relative;
top: 3px;
margin: 0px 3px;
}
input{
width: 330px;
height: 54px;
margin: 10px;
text-indent: 2em;
margin-top: -5px;
}
.num1{
width: 194px;
}
.num2{
width: 126px;
height: 56px;
margin-left: -5px;
text-indent: 0em;
background-color: #57565f;
border: 1px solid grey;
border-radius: 3px;
}
section p{
font-size: 12px;
text-indent: 1em;
color: grey;
}
section a{
color: dodgerblue;
}
section .num3{
background-color: #ff3c3c;
border: 1px solid #ff3c3c;
border-radius: 5px;
text-indent: 0em;
font-size: 17px;
color: white;
}
h1{
text-indent: 5em;
}
section{
width: 360px;
margin: 0px auto;
}
footer p{
text-align: center;
font-size: 15px;
}
footer p a{
color: black;
}
footer p a:hover{
color: red;
}
</style>
</head>
<body>
<header>
<div class="one">
<img src="../../img/logo.png">
</div>
<div class="two">
<p>您好，欢迎光临1号店！<a href="#">请登录</a></p>
<a href="#"><span><img src="images/runbun.png"></span>帮助中心<span><img src="images/turnb.png"></span></a>
</div>
</header>
<hr>
<section>
<div>
<h1>1号店注册</h1>
<form method="get" action="#">
<input type=text placeholder="手机号"><br>
<input type="text" placeholder="手机号" class="num1">
<input type=submit value="获取验证码" class="num2"><br>
<input type="password" placeholder="密码"><br>
<input type="password" placeholder="确认密码"><br>
<p>点击注册，表示您同意1号店 <a href="#">《服务协议》</a></p>
<input type="submit" value="同意协议并注册" class="num3">
</form>
</div>
</section>
<footer>
<p><a href="#">沪ICP备13044278号</a>| 合字B1.B2-20130004 |<a href="#">营业执照</a></p>
<p>Copyright © 1号店网上超市 2007-2016，All Rights Reserved</p>
</footer>
<hr >
</body>
</html>
登录页面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
*{
margin: 0px;
padding: 0px;
}
.clear:after{
display: block;
content: "";
clear: both;
}
#hz{
width: 1000px;
margin: 10px auto;
}
#hz>img{
float: left;
}
#hz1>span:first-of-type{
font-size: 13px;
color: gray;
float: left;
margin-left: 470px;
margin-top: 18px;
}
#z{
color: dodgerblue;
}
#hz2{
float: right;
margin-top: 10px;
padding: 5px 10px;
}
#hz2 span{
font-weight: 500;
}
#hz2 img{
vertical-align: middle;
}
#hz3{
width: 1200px;
height: 500px;
margin: 10px auto;
background-color: rgb(252,252,252);
}
#hz3 img{
float: left;
margin-top: 50px;
margin-left: 80px;
}
#hz4{
float: right;
width: 350px;
height: 400px;
margin-top: 100px;
margin-right: 120px;
}
#hz5 span:first-of-type{
float: left;
font-size: 15px;
font-weight: bold;
color: rgb(99,96,141);
}
#hz5 span:last-of-type{
float: right;
color: #1E90FF;
font-size: 13px;
}
.hz6{
height: 50px;
margin-top: 28px;
}
.b{
border: 1px solid gray;
background: url(img/userHead.png)no-repeat 15px 15px;
width: 348px;
height: 54px;
text-indent: 4em;
}
.b1{
border: 1px solid gray;
background: url(img/lock.png)no-repeat 15px 15px;
width: 348px;
height: 54px;
text-indent: 4em;
margin-top: 10px;
}
.b2{
float: left;
color: gray;
}
.b3{
float: right;
color: grey;
}
.b4{
margin-top: px;
height: 10px;
}
.b5{
background-color: red;
margin-top: 18px;
width: 350px;
padding: 10px;
font-weight: bold;
font-size: 20px;
color: white;
border: red solid 1px;
}
.hz7{
width: 350px;
margin-top: 190px;
}
.hz7>span{
font-size: 15px;
}
li{
list-style: none;
}
.hz8{
width: 350px;
height: 50px;
margin-top: 20px;
background: url(img/l_1.png)no-repeat;
}
.hz8>p{
float: right;
}
#hz10 p{
text-align: center;
font-size: 15px;
}
</style>
</head>
<body>
<!-- 头部 -->
<div id="hz" class="clear">
<img src="../img/logo.png">
<div id="hz1">
<span>您好，欢迎光临1号店！<span id="z">请登录</span></span>
</div>
<div id="hz2">
<img src="../img/runbun.png">
<span>帮助中心</span>
<img src="../img/turnb.png">
</div>
<hr >
</div>
<!-- 身体 -->
<div id="hz3">
<img src="../img/loadimg.jpg">
<div id="hz4" class="clear">
<div id="hz5">
<span>1号店用户登录</span>
<span>注册账号</span>
</div>
<div class="hz6">
<form>
<p><input type="text" placeholder="邮箱/手机/用户名" class="b"></p>
<p><input type="password" placeholder="密码" class="b1"></p>
<p class="b4"></p><p class="b2"><input type="checkbox"> 自动登录</p><p class="b3">忘记密码？</p><p></p>
<p><input type="submit" value="登录" class="b5"></p>
</form>
</div>
<div class="hz7">
<span>更多合作网站账号登录</span>
</div>
<div class="hz8">
<p>更多合作网站</p>
</div>
</div>
</div>
<div id="hz10">
<p>沪ICP备13044278号| 合字B1.B2-20130004 |营业执照</p>
<p>Copyright © 1号店网上超市 2007-2016，All Rights Reserved</p>
</div>
</body>
</html>
商品详情页
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
header div:nth-of-type(1){
background: linear-gradient(to top,lightgray,whitesmoke);
height: 35px;
width: 100%;
font-size: 13px;
font-weight: lighter;
}
#nj{
position: absolute;
left: 50px;
padding-top: 10px;
font-size: 12px;
font-weight: lighter;
vertical-align: middle;
}
ul{
list-style: none;
float: right;
padding-right: 50px;
}
li{
display: inline-block;
}
a{
text-decoration: none;
color: black;
}
a:hover{
color: red;
}
.jj{
color: red;
}
header div img:nth-of-type(1){
padding-left: 5px;
}
.dian{
margin-left: 40px;
margin-top: 40px;
}
section input:nth-child(1) {
width: 450px;
height: 50px;
border: red 3px solid;
font-size: 18px;
text-indent: 1em;
}
section input:nth-child(2) {
background-color: red;
width: 100px;
height: 50px;
border: red;
font-size: 18px;
font-weight: bolder;
color: white;
float: right;
overflow: hidden;
}
u{
width: 550px;
margin-top: -70px;
margin-right: auto;
margin-bottom: 0px;
margin-left: 400px;
}
.js{
position: relative;
left: -135px;
top: -20px;
font-size:13px;
}
.js li{
margin: 10px;
}
.a {
border: 1px solid lightgray;
float: right;
width: 120px;
text-align: center;
padding: 10px;
background-color: whitesmoke;
position: absolute;
top: 90px;
margin-left: 990px;
}
.ik{
padding: 0px 0px 0px 0px;
width: 1100px;
border-bottom:2px red solid;
position:absolute;
top: 230px;
left: 80px;
}
section div:nth-of-type(2) ul{
position: absolute;
left: -40px;
top: -50px;
}
section div:nth-of-type(2) ul li{
margin-right: 25px;
font-weight: bold;
margin-bottom: 0px;
}
.hn{
background-color: red;
color: white;
height: 35px;
width: 180px;
margin-bottom: 0px;
margin-left: 0px;
text-align: center;
}
.um{
position: absolute;
right: 20px;
top: -35px;
}
.vb{
position: absolute;
left: 60px;
top: 250px;
font-size: 13px;
}
.one{
width: 390px;
height: 800px;
position:absolute;
left: 100px;
top: 300px;
}
.two{
width: 575px;
height: 800px;
position:absolute;
left: 520px;
top: 280px;
}
#vc{
font-weight: bold;
color: black;
}
#cv{
font-weight: lighter;
color: gray;
font-size: 13px;
}
.jiage{
font-size: 16px;
}
.jia{
font-size: 22px;
font-weight: bold;
color: red;
}
.jm{
width: 18px;
height: 18px;
overflow: hidden;
background: url(../img/ch.png) no-repeat center top;
position: absolute;
right: 452px;
bottom: 642px;
}
.jmc{
width: 18px;
height: 18px;
overflow: hidden;
background: url(../img/ch.png) no-repeat center top;
position: absolute;
right: 342px;
bottom: 600px;
}
.lo{
position: absolute;
right: 450px;
top:130px;
}
#bn{
border: 2px red solid;
width: 65px;
height: 26px;
text-align: center;
color: gray;
}
.bn{
border: 2px lightgray solid;
width: 65px;
height: 26px;
text-align: center;
color: gray;
position: absolute;
right: 368px;
top: 130px;
}
.nn{
border: 2px lightgray solid;
width: 65px;
height: 26px;
text-align: center;
color: gray;
position: absolute;
right: 285px;
top: 130px;
}
.on{
border: 2px lightgray solid;
width: 65px;
height: 26px;
text-align: center;
color: gray;
position: absolute;
right: 425px;
top: 170px;
}
.cbn{
border: 2px red solid;
width: 65px;
height: 26px;
text-align: center;
color: gray;
position: absolute;
right: 340px;
top: 170px;
}
.two ul:nth-of-type(3){
position: absolute;
right: 210px;
top: 240px;
width: 300px;
height: 200px;
}
.two ul:nth-of-type(3) li:nth-of-type(2){
margin-left: 100px;
}
.mnc{
width: 150px;
margin-top: -15px;
margin-left: 40px;
padding-top: 5px;
display: none;
position: absolute;
right: 200px;
top: 40px;
}
.aaza:hover .mnc{
display: block;
}
.zxc{
width: 56px;
height: 40px;
line-height: 43px \9;
background: none;
color: #555555;
font-size: 18px;
text-align: center;
padding: 0;
border: 1px lightgray solid;
position: absolute;
right: 510px;
top: 330px;
}
.zxv{
width: 21px;
height: 21px;
overflow: hidden;
background: url(../珠宝项目/jia.gif) no-repeat center top;
float: right;
border: 0;
border-left: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
cursor: pointer;
position: absolute;
right: 490px;
top: 330px;
}
.zxv1{
width: 21px;
height: 21px;
overflow: hidden;
background: url(../珠宝项目/jian.gif) no-repeat center top;
float: right;
border: 0;
border-left: 1px solid #cccccc;
cursor: pointer;
position: absolute;
right: 490px;
top: 352px;
}
.npc{
position: absolute;
right: 290px;
top: 328px;
}
#zuo{
width: 15px;
height: 90px;
background: url(../珠宝项目/r_left.png) no-repeat left center;
position: absolute;
top: 720px;
left: 390px;
cursor: pointer;
}
#you{
width: 15px;
height: 90px;
background: url(../珠宝项目/r_right.png) no-repeat right center;
position: absolute;
top: 720px;
right: 1120px;
cursor: pointer;
}
#fen{
position: absolute;
top: 600px;
left: 80px;
height: 90px;
overflow: hidden;
}
#fen ul li{
padding-right: 10px;
padding-left: 10px;
padding-top: 20px;
}
.lm{
width: 188px;
height: 188px;
overflow: hidden;
float: right;
border: 1px solid #eaeaea;
position: absolute;
right: 50px;
top: 320px;
}
.lm1{
width: 188px;
height: 132px;
overflow: hidden;
border-bottom: 1px solid #eaeaea;
}
.lm2{
height: 55px;
line-height: 55px;
overflow: hidden;
background-color: #f6f6f6;
font-size: 16px;
text-align: center;
}
#l1 {
border-width: 1px 2px 2px;
border-style: solid dashed dotted;
border-color: #F5F5F5;
margin-top: 600px;
}
#l1 p{
margin-left: 260px;
}
#l1 h2{
font-size: 15px;
color: red;
margin-left: 280px;
}
</style>
</head>
<body>
<header>
<div>
<span id="nj">送货至：四川</span>
<ul>
<li>你好!请<a href="#"> 登录</a></li>
<li><a href="#" class="jj">免费注册</a> </li>
<li> | <a href="#">我的订单</a> | <a href="#"> 收藏夹</li>
<li><a href="#"> 客户服务</a>|</li>
<li><a href="#"> 网站导航</a>| 关注我们： </li>
<li>| <a href="#"> 手机版</a>|</li>
</ul>
</div>
</header>
<section>
<img class="dian" src="../img/logo.png">
<div class="ccu">
<form>
<input type="search" value="请输入关键词">
<input type="submit" value="搜索">
</form>
<ul class="js">
<li><a href="#"> 咖啡</a></li>
<li><a href="#"> iphone 6S</a></li>
<li><a href="#">新鲜美食</a></li>
<li> <a href="#">蛋糕</a></li>
<li> <a href="#">日用品</a></li>
<li><a href="#">连衣裙</a> </li>
</ul>
</div>
<span class="a">
<img src="../img/car.png"><a href="#" style="color: black">购物车</a>
</span>
<div class="ik">
<ul>
<li> <div class="hn">全部商品分类</div></li>
<li class="jj">首页</li>
<li class="jj">自营超市</li>
<li><a href="#" > 1号团</a></li>
<li><a href="#">1号超市</a></li>
<li><a href="#">女装</a></li>
<li><a href="#">美妆</a></li>
<li><a href="#">1号海购</a></li>
<li><a href="#">团购</a></li>
</ul>
<img class="um" src="../img/phone.png" >
</div>
<ul class="vb">
<li>所有团购 > 包饰 > 珠韵首饰</li> <li class="jj">冰韵 天然白色正圆S925银扣珍珠项链</li>
</ul>
<div class="one">
<img src="../img/p_big.jpg" width="390" height="390">
</div>
<div class="two">
<span id="vc">珠韵首饰 冰韵 天然白色正圆S925银扣珍珠项链</span><br/>
<span id="cv">全国包邮 送妈妈，正圆级淡水珍珠，白色S925银链扣，使用方便，尊贵礼物。</span>
<p></p>
<p><span class="jiage">本店价格：</span><span class="jia">¥1786</span></p>
<p><span class="jiage">参考价：¥3886</span></p>
<p class="jiage">尺码：</p>
<ul>
<li class="lo">
<div id="bn">
43cm
</div>
</li>
<div class="jm"></div>
<li><div class="bn">
45cm
</div></li>
<li><div class="nn">
50cm
</div></li>
</ul>
<p class="jiage">颜色选择：</p>
<ul>
<li><div class="on">
粉色
</div></li>
<li >
<div class="cbn">白色</div>
</li>
<div class="jmc"></div>
</ul>
<ul>
<li class="aaza">
<img src="../img/sh.png" > 分享
<a href="#">
<div class="mnc">
<img src="../珠宝项目/sh_1.gif">
<img src="../珠宝项目/sh_2.gif">
<img src="../珠宝项目/sh_3.gif">
<img src="../珠宝项目/sh_4.gif">
<img src="../珠宝项目/sh_5.gif">
</div>
</a>
</li>
<li><img src="../img/heart_h.png" > 关注商品</li>
</ul>
<input type="text" class="zxc">
<input type="button" value="1"class="zxv">
<input type="button" value=""class="zxv1">
<span class="npc"><img src="../img/car.png"></span>
</div>
<div id="zuo"></div>
<div id="fen">
<ul>
<li><img src="../img/p_big.jpg" width="65" height="65"></li>
<li><img src="../img/de5.jpg" width="65" height="65"></li>
<li><img src="../img/mat_2.jpg" width="65" height="65"></li>
<li><img src="../img/mat_3.jpg" width="65" height="65"></li>
</ul>
</div>
<div id="you"></div>
<div class="lm">
<div class="lm1">
<img src="../img/sbrand.jpg" width="188" height="132">
</div>
<div class="lm2">
<a href="#">进入品牌专区</a><img src="../img/sbrand.jpg" >
</div>
</section>
<div id="l1">
<h2>商品详情</h2>
<p><img src="../img/de2.jpg" ></p>
<p><img src="../img/de3.jpg" ></p>
<p><img src="../img/de4.jpg" ></p>
<p><img src="../img/de5.jpg" ></p>
<p><img src="../img/de6.jpg" ></p>
<p><img src="../img/de7.jpg" ></p>
<p><img src="../img/de8.jpg" ></p>
</div>
<div id="nb8">
<ul>
<li><img src="images/b1.png"></li>
<li>正品保障</li>
<li>正品行货 放心购买</li>
</ul>
<ul>
<li><img src="images/b2.png"></li>
<li>满38包邮</li>
<li>满38包邮 免运费</li>
</ul>
<ul>
<li><img src="images/b3.png"></li>
<li>天天低价</li>
<li>天天低价 畅选无忧</li>
</ul>
<ul>
<li><img src="images/b4.png"></li>
<li>准时送达</li>
<li>收货时间由你做主</li>
</ul>
</div>
<div id="nb9">
<dl>
<dt><a href="#">新手上路</a> </dt>
<dd><a href="#">售后流程</a></dd>
<dd><a href="#">购物流程</a></dd>
<dd><a href="#">订购方式</a></dd>
<dd><a href="#">隐私声明</a></dd>
<dd><a href="#">推荐分享说明</a></dd>
</dl>
<dl>
<dt><a href="#">配送与支付</a> </dt>
<dd><a href="#">货到付款区域</a></dd>
<dd><a href="#">配送支付查询</a></dd>
<dd><a href="#">支付方式说明</a></dd>
</dl>
<dl>
<dt><a href="#">会员中心</a> </dt>
<dd><a href="#">资金管理</a></dd>
<dd><a href="#">我的收藏</a></dd>
<dd><a href="#">我的订单</a></dd>
</dl>
<dl>
<dt><a href="#">服务保证</a> </dt>
<dd><a href="#">退换货原则</a></dd>
<dd><a href="#">售后服务保证</a></dd>
<dd><a href="#">产品质量保证</a></dd>
</dl>
<dl>
<dt><a href="#">联系我们</a> </dt>
<dd><a href="#">网站故障报告</a></dd>
<dd><a href="#">购物咨询</a></dd>
<dd><a href="#">投诉与建议</a></dd>
</dl>
<div class="las">
<img src="images/er.gif" >
<ul>
<li><img src="images/b_sh_1.png"><a href="#">新浪微博</a> </li>
<li><img src="images/b_sh_2.png"><a href="#">腾讯微博</a> </li>
<li><p>服务热线：</p></li>
<li><span>400-123-4567</span></li>
</ul>
<img src="images/ss.png">
</div>
</div>
</section>
<footer>
<div id="sb">
<p>备案/许可证编号：蜀ICP备12009302号-1-www.dingguagua Copyright© 1号店网
上超市 2007-2016，All Rights Reserved. 复制必究 , Technical Support: Dgg
Group</p>
<ul>
<li><img src="images/b_1.gif"></li>
<li><img src="images/b_2.gif"></li>
<li><img src="images/b_3.gif"></li>
<li><img src="images/b_4.gif"></li>
<li><img src="../img/b_5.gif"></li>
<li><img src="../img/b_6.gif"></li>
</ul>
</div>
</footer>
</body>
</html>
搜索页面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
li{
list-style: none;
}
a{
text-decoration: none;
}
header{
margin-top: -10px;
height: 30px;
padding:5px;
background: linear-gradient(gainsboro,ghostwhite);
overflow: hidden;
}
header span{
color: dimgray;
position: absolute;
left: 50px;
padding-top: 6px;
font-size: 12px;
font-weight: lighter;
}
.顶部导航 .注册{
color: red;
}
.顶部导航 li{
display: inline-block;
font-size: 12px;
font-weight: lighter;
color:dimgray;
margin: 0px 5px;
vertical-align: top;
}
.顶部导航{
float: right;
position: absolute;
right: 60px;
margin: 6px;
overflow: hidden;
}
.顶部导航 li a{
color: dimgray;
}
.菜单导航 li{
display: inline-block;
margin: 10px;
font-size: 20px;
}
.顶部导航 a:hover{
color: red;
}
header div{
width: 130px;
border: 1px solid lightgray;
position: relative;
top: 10px;
left: -40px;
background-color: white;
display: none;
}
header div p{
text-align: center;
}
header div p a{
color: gray;
font-weight: lighter;
font-size: 10px;
}
.顶部导航 li:nth-child(4){
width: 70px;
}
.顶部导航 li:nth-child(4):hover div{
display: block;
}
.搜索 input:nth-child(1){
width: 450px;
height: 50px;
border: red 3px solid;
font-size: 18px;
text-indent: 1em;
}
.搜索 input:nth-child(2){
background-color: red;
width: 100px;
height:50px;
border: red;
font-size: 18px;
font-weight: bolder;
color: white;
float: right;
overflow: hidden;
}
.搜索 ul{
position: relative;
left: -50px;
top: -20px;
}
.搜索 li{
display: inline-block;
margin: 10px;
}
.搜索 a{
font-size: 12px;
color: dimgray;
}
.搜索 a:hover{
color: red;
}
.搜索{
width: 550px;
margin: 0px auto;
}
.a{
border: 1px solid lightgray;
float: right;
width: 120px;
text-align: center;
padding: 10px;
background-color: whitesmoke;
position: absolute;
top: 110px;
right: 50px;
}
.a img{
position: relative;
left: -25px;
}
section{
width: 1250px;
overflow: hidden;
margin: 0px;
}
section .loginlogo{
position: relative;
left: 60px;
top: 50px;
}
.分类{
width: 1330px;
border-bottom: 3px solid orangered;
margin-top: -30px;
margin-left: 20px;
margin-right: 20px;
}
h3{
width: 200px;
padding: 10px;
text-indent: 1em;
background-color: red;
color: white;
float: left;
overflow: hidden;
position: relative;
top: -3px;
}
.分类 img{
position: absolute;
right: 50px;
top: 220px;
}
.分类 nav{
position: relative;
top: 15px;
}
.菜单导航 a{
font-size: 17px;
color: black;
font-weight: bolder;
}
.菜单导航 .hong{
color: red;
}
section .one{
position: relative;
left: -220px;
font-size: 13px;
font-weight: lighter;
}
section .one span{
border: 1px red dashed;
padding: 5px;
}
section .one span b{
color: red;
}
.nb1{
width: 1200px;
margin: 0px auto;
border: 2px solid grey;
}
.nb1 dl{
border-bottom: 1px solid grey;
padding-bottom: 10px;
}
.nb1 dl dd{
display: inline;
margin: 10px;
}
.nb1 a{
color: grey;
font-size: 12px;
}
.nb1 a:hover{
color: orangered;
}
.nb1 dl:nth-child(1) dd a{
margin-right: 33px;
}
.nb1 dl:nth-child(2) dd a{
margin-right: 3px;
margin-left: 30px;
}
.nb1 dl:nth-child(3) dd a{
margin-right: 33px;
}
.nb1 dl:nth-child(4) dd a{
margin-right: 33px;
}
#sb{
overflow: hidden;
}
.nb2{
width: 222px;
border: 1px solid gainsboro;
margin-left: 23px;
margin-top: 10px;
float: left;
}
.nb2 p{
width: 200px;
padding: 10px;
margin-left: 0px;
margin-top: 0px;
}
.nb2 input{
position: relative;
left: 60px;
border: none;
background: white;
color: grey;
}
.nb2 .aaa{
padding-left: 10px;
margin-right: 30px;
background: url("images/h_t.gif") no-repeat;
color: orangered;
}
.nb2 ul{
margin-left: -40px;
margin-bottom: 0px;
}
.nb2 ul li:nth-child(1){
width: 185px;
height: 162px;
margin-bottom: 19px;
}
.nb2 ul li:nth-child(2){
text-align: center;
}
.nb2 ul li:nth-child(2):hover{
color: orangered;
}
.nb2 ul li:nth-child(3){
text-align: center;
color:brown;
font-size: 25px;
border-bottom: 1px solid gainsboro;
}
.nb3 ul li{
display: inline-block;
width: 50px;
border: 1px solid grey;
font-size: 13px;
padding:5px 15px;
margin-right: -5px;
}
.nb3 ul li:nth-child(1){
background-color: orangered;
color: white;
}
.nb3 ul{
margin-left: -40px;
display: inline-block;
}
.nb3 .tu1{
position: relative;
left: 10px;
top: -8px;
}
.nb3 .tu2{
position: relative;
left: 4px;
}
.nb3 .tu3{
position: relative;
left: 10px;
top: -8px;
}
.nb3 .tu4{
position: relative;
left: 4px;
}
.nb3 ul li:hover{
background-color: orangered;
}
.nb3 span{
position: relative;
left: 570px;
font-size: 13px;
}
.nb3{
width: 1200px;
height: 51px;
margin: 0px auto;
border-bottom: 1px solid grey;
}
.nb4 ul{
width: 210px;
padding: 10px;
margin: 5px;
display: inline-block;
}
.nb4 ul img{
width: 200px;
height: 200px;
}
.nb4 ul li:nth-child(2){
color: orangered;
text-align: center;
}
.nb4 ul li:nth-child(3){
font-size: 14px;
margin-bottom: 10px;
}
.nb4 ul li:nth-child(4){
font-size: 12px;
}
.nb4 ul li a{
color: dimgray;
}
.nb4 ul li:nth-child(4) a:nth-child(1){
padding: 3px 10px 3px 30px;
border: 1px solid gainsboro;
background: url("images/heart.png") no-repeat 5px 5px;
}
.nb4 ul li:nth-child(4) a:nth-child(2){
padding: 3px 15px 3px 70px;
border: 1px solid gainsboro;
background: url("images/cars.png") no-repeat 30px 2px;
}
.nb4 ul:hover {
box-shadow: 0px 0px 4px grey;
}
.nb4 ul:hover li:nth-child(4) a:nth-child(2){
background: url("images/cars_h.png") no-repeat 30px 2px orangered;
color: white;
}
.nb4 ul li:nth-child(3):hover a{
color: orangered;
}
.nb4 ul li:nth-child(4):hover a:nth-child(1){
background: url("images/heart_h.png")no-repeat 5px 5px;
}
section .nb5 input{
height: 36px;
width: 73px;
font-size: 16px;
color: dimgray;
background-color: white;
border: 1px solid gainsboro;
}
section .nb5 input:hover{
background-color: gainsboro;
}
section .nb5 span{
border: 1px solid gainsboro;
padding: 6px 10px;
}
section .nb5 span:hover{
background-color: orangered;
}
section .nb5{
float: right;
margin-top: 20px;
margin-right: 40px;
margin-bottom: 40px;
}
#nb8{
margin-left: 20px;
padding-left: 60px;
width: 1140px;
}
#nb8 ul{
display: inline-block;
margin: 40px;
}
#nb8 ul li:nth-child(1){
text-align: center;
}
#nb8 ul li:nth-child(2){
text-align: center;
font-weight: bolder;
font-size: 20px;
}
#nb8 ul li:nth-child(3){
font-weight: lighter;
color: gray;
}
#nb8 img{
transition: all 3s ease-in-out;
}
#nb8 img:hover{
transform: rotate(360deg);
}
#nb9 dl{
display: inline-block;
width: 150px;
height: 200px;
vertical-align: top;
margin-left: 30px;
margin-right: -20px;
}
#nb9 dl dt {
text-indent: 2.5em;
margin-bottom: 20px;
font-weight: bolder;
}
#nb9 dl dt a{
color: black;
}
#nb9 dl dt a:hover{
text-decoration:underline;
}
#nb9 dl dd a{
font-weight: lighter;
font-size: 13px;
line-height: 30px;
color: black;
}
#nb9 dl dd a:hover{
color: red;
}
#nb9 .las{
float: right;
position: relative;
left: -50px;
width: 300px;
}
#nb9 .las img:nth-child(1){
float: left;
margin-right: 20px;
}
#nb9 .las ul li{
line-height: 30px;
}
#nb9 .las ul a{
color: gray;
margin-left: -10px;
}
#nb9 .las ul a:hover{
color: red;
}
#nb9 .las ul li:nth-child(2){
position: relative;
top: 10px;
}
#nb9 .las ul li:nth-child(3){
font-size: 13px;
position: relative;
top: 15px;
}
#nb9 .las ul li:nth-child(4){
font-size: 20px;
color: red;
}
#sb1 p {
font-size: 14px;
}
#sb1 ul li{
display: inline-block;
}
#sb1 ul li img{
width: 98px;
height: 33px;
border: 1px solid gainsboro;
border-radius: 8px;
position: relative;
left: 100px;
}
#sb1{
width: 1000px;
margin: 0px auto;
}
</style>
</head>
<body>
<header>
<span>送货至：湖南衡阳</span>
<ul class="顶部导航">
<li>你好! 请<a href="#">登录 </a><a href="#" class="注册">免费注册</a>|</li>
<li><a href="#">我的订单</a> </li>
<li><a href="#">收藏夹 </a><img src="../img/t_arrow.gif"> |</li>
<li><a href="#">客户服务</a><img src="../img/t_arrow.gif">
<div>
<p><a href="#">客服服务</a></p>
<p><a href="#">客服服务</a></p>
<p><a href="#">客服服务</a></p>
</div></li>
<li><a href="#">| 网站导航</a><img src="../img/t_arrow.gif">|</li>
<li>关注我们：<a href="#"><img src="../img/sh1.png"></a> <a href="#"><img src="images/sh2.png"></a> |</li>
<li><a href="#"> 手机版</a> <img src="../img/sh2.png"> </li>
</ul>
</header>
<section>
<img class="loginlogo" src="../img/logo.png">
<div class="搜索">
<form method="get" action="#">
<input type="search" placeholder="请输入关键字">
<input type= submit value="搜索" >
<ul>
<li><a href="#">咖啡</a> </li>
<li><a href="#"> iphone 6S</a> </li>
<li><a href="#">新鲜美食</a> </li>
<li><a href="#">蛋糕</a> </li>
<li><a href="#">日用品</a> </li>
<li><a href="#">连衣裙</a> </li>
</ul>
</form>
</div>
<span class="a">
<img src="../img/car.png"><a href="#" style="color: black">购物车</a>
</span>
<div class="分类">
<h3>全部商品分类</h3>
<nav>
<ul class="菜单导航">
<li ><a href="#" class="hong">首页</a></li>
<li ><a href="#" class="hong">自营超市</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>
<img src="../img/phone.png">
</div>
<p class="one"> 全部 > 珠宝饰品 > 珍珠项链 > <span>品牌：<b>珠韵首饰</b> </span></p>
<div class="nb1">
<dl style="height: 60px; border-bottom: 1px solid grey">
<dd style="float: left; height: 70px;width: 90px;margin-top: -0px">品牌：</dd>
<dd>
<a href="#" style="color: orangered">珠韵首饰/ZHUYUN JEWELLERY</a>
<a href="#">施华洛世奇/Swarovski</a>
<a href="#"> 海瞳</a>
<a href="#">周大福/CHOW TAI FOOK</a>
<a href="#">京润珍珠</a>
<a href="#">佰色传情 /BRI.R </a>
<a href="#">迈姿/Maizi</a>
<a href="#">Ginasy Jewelry</a>
<a href="#">心鑫圆</a>
<a href="#"> 银斯妮/yin si ni silver</a>
<a href="#">迈姿/Maizi</a>
<a href="#">Ginasy Jewelry</a>
<a href="#">蛟蓓</a>
<a href="#">芭比/Barbie</a>
<a href="#">珍福祥</a>
<a href="#">珍福祥</a>
</dd>
</dl>
<dl>
<dd> 价格：</dd>
<dd>
<a href="#">0-199</a>
<a href="#" style="color: orangered">200-399</a>
<a href="#">400-599</a>
<a href="#">600-899</a>
<a href="#">900-1299</a>
<a href="#">1300-1399</a>
<a href="#">1400以上</a>
</dd>
</dl>
<dl>
<dd>珍珠颜色：</dd>
<dd>
<a href="#">混彩</a>
<a href="#"> 混彩</a>
<a href="#">黑色系</a>
<a href="#">粉色系</a>
<a href="#">白色系</a>
<a href="#">金色系</a>
<a href="#">紫色系</a>
</dd>
</dl>
<dl style="border-bottom: none">
<dd>珍珠分类：</dd>
<dd>
<a href="#">天然海水珍珠</a>
<a href="#">养殖海水珍珠</a>
<a href="#">养殖淡水珍珠</a>
<a href="#">天然淡水珍珠</a>
</dd>
</dl>
</div>
<div id="sb">
<div class="nb2">
<form method="get" action="#"> <p>
<span class="aaa">浏览历史</span><input type="reset" value="清空">
</p></form>
<ul>
<li><img src="../img/his_4.jpg"></li>
<li>Dior/迪奥香水2件套装</li>
<li>￥368.00</li>
</ul>
<ul>
<li><img src="../img/his_1.jpg"></li>
<li>Dior/迪奥香水2件套装</li>
<li>￥768.00</li>
</ul>
<ul>
<li><img src="../img/his_1.jpg"></li>
<li>Dior/迪奥香水2件套装</li>
<li>￥680.00</li>
</ul>
<ul>
<li><img src="../img/his_1.jpg"></li>
<li>Dior/迪奥香水2件套装</li>
<li>￥368.00</li>
</ul>
<ul>
<li><img src="../img/his_1.jpg"></li>
<li>Dior/迪奥香水2件套装</li>
<li>￥368.00</li>
</ul>
</div>
<div class="nb3">
<ul>
<li>默认</li>
<li>销量<b class="tu1"><img src="../img/i_up.gif"></b><b class="tu2"><img src="../img/i_down.gif"></b></li>
<li>价格<b class="tu3"><img src="../img/i_up.gif"></b><b class="tu4"><img src="../img/i_down.gif"></b></li>
<li>新品</li>
</ul>
<span>共发现120件</span>
</div>
<div class="nb4">
<ul>
<li><img src="../img/per_1.jpg"></li>
<li>￥198.00</li>
<li><a href="#">海瞳7-8mm水滴形天然珍珠项链</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_2.jpg"></li>
<li>￥598.00</li>
<li><a href="#">佰色传情淡水珍珠项链圆8-9mm</a></li>
<li><a href="#">收藏</a><a href="#" class="two">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_3.jpg"></li>
<li>￥440.00</li>
<li><a href="#">京润 【魅惑】海水珍珠项链</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_4.jpg"></li>
<li>￥680.00</li>
<li><a href="#">心鑫圆 天然珍珠项链淡水套装</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_5.jpg"></li>
<li>￥1980.00</li>
<li><a href="#">海瞳 明星款 玛瑙天然淡水珍珠</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_6.jpg"></li>
<li>￥198.00</li>
<li><a href="#">佰色传情 淡水珍珠项链</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_7.jpg"></li>
<li>￥390.00</li>
<li><a href="#">7-8mm米形珍珠 加长型</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_17.jpg"></li>
<li>￥2980.00</li>
<li><a href="#">珠韵首饰 多色可选(白色)</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_16.jpg"></li>
<li>￥670.00</li>
<li><a href="#">小清新8.5-10.5mm珍珠吊坠项链</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_15.jpg"></li>
<li>￥2198.00</li>
<li><a href="#">京润 【简爱】 淡水珍珠项链</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_11.jpg"></li>
<li>￥5198.00</li>
<li><a href="#">海瞳 罕见7-8mm高亮泽 表皮光</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_11.jpg"></li>
<li>￥212.00</li>
<li><a href="#">媲美海水珠 天然浅粉金色珍珠项</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_12.jpg"></li>
<li>￥618.00</li>
<li><a href="#">无暇品质(925银玫瑰花型银扣)</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_11.jpg"></li>
<li>￥260.00</li>
<li><a href="#">珍珠吊坠925银镀金 淡水珍珠项</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_10.jpg"></li>
<li>￥198.00</li>
<li><a href="#">海瞳 淡水珍珠项链锁骨链</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_10.jpg"></li>
<li>￥698.00</li>
<li><a href="#">海瞳 淡水珍珠吊坠</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_10.jpg"></li>
<li>￥198.00</li>
<li><a href="#">超强光珍珠吊坠项链</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_10.jpg"></li>
<li>￥865.00</li>
<li><a href="#">节节高升花生款(玫瑰色款)</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_12.jpg"></li>
<li>￥198.00</li>
<li><a href="#">佰色传情 编织款珍珠项链</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
<ul>
<li><img src="../img/per_13.jpg"></li>
<li>￥2198.00</li>
<li><a href="#">珠圆玉润 送爱人</a></li>
<li><a href="#">收藏</a><a href="#">加入购物车</a></li>
</ul>
</div>
<nav class="nb5">
<form method="get" action="#">
<input type="submit" value="上一页">
<span class="aaa" style="background-color: orangered">1</span>
<span class="bbb">2</span>
<span class="ccc">3</span>
...
<span class="ddd">20</span>
<input type="submit" value="下一页">
</form>
</nav>
</div>
</section>
<footer>
<div id="nb8">
<ul>
<li><img src="../img/b1.png"></li>
<li>正品保障</li>
<li>正品行货 放心购买</li>
</ul>
<ul>
<li><img src="../img/b2.png"></li>
<li>满38包邮</li>
<li>满38包邮 免运费</li>
</ul>
<ul>
<li><img src="../img/b3.png"></li>
<li>天天低价</li>
<li>天天低价 畅选无忧</li>
</ul>
<ul>
<li><img src="../img/b4.png"></li>
<li>准时送达</li>
<li>收货时间由你做主</li>
</ul>
</div>
<div id="nb9">
<dl>
<dt><a href="#">新手上路</a> </dt>
<dd><a href="#">售后流程</a></dd>
<dd><a href="#">购物流程</a></dd>
<dd><a href="#">订购方式</a></dd>
<dd><a href="#">隐私声明</a></dd>
<dd><a href="#">推荐分享说明</a></dd>
</dl>
<dl>
<dt><a href="#">配送与支付</a> </dt>
<dd><a href="#">货到付款区域</a></dd>
<dd><a href="#">配送支付查询</a></dd>
<dd><a href="#">支付方式说明</a></dd>
</dl>
<dl>
<dt><a href="#">会员中心</a> </dt>
<dd><a href="#">资金管理</a></dd>
<dd><a href="#">我的收藏</a></dd>
<dd><a href="#">我的订单</a></dd>
</dl>
<dl>
<dt><a href="#">服务保证</a> </dt>
<dd><a href="#">退换货原则</a></dd>
<dd><a href="#">售后服务保证</a></dd>
<dd><a href="#">产品质量保证</a></dd>
</dl>
<dl>
<dt><a href="#">联系我们</a> </dt>
<dd><a href="#">网站故障报告</a></dd>
<dd><a href="#">购物咨询</a></dd>
<dd><a href="#">投诉与建议</a></dd>
</dl>
<div class="las">
<img src="../img/er.gif" >
<ul>
<li><img src="../img/b_sh_1.png"><a href="#">新浪微博</a> </li>
<li><img src="../img/b_sh_2.png"><a href="#">腾讯微博</a> </li>
<li><p>服务热线：</p></li>
<li><span>400-123-4567</span></li>
</ul>
<img src="../img/ss.png">
</div>
</div>
<div id="sb1">
<p>备案/许可证编号：蜀ICP备12009302号-1-www.dingguagua Copyright© 1号店网
上超市 2007-2016，All Rights Reserved. 复制必究 , Technical Support: Dgg
Group</p>
<ul>
<li><img src="../img/b_1.gif"></li>
<li><img src="../img/b_2.gif"></li>
<li><img src="../img/b_3.gif"></li>
<li><img src="../img/b_4.gif"></li>
<li><img src="../img/b_5.gif"></li>
<li><img src="../img/b_6.gif"></li>
</ul>
</div>
</footer>
</body>
</html>
商品主页
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
li{
list-style: none;
}
a{
text-decoration: none;
}
header{
margin-top: 10px;
height: 30px;
padding:5px;
background: linear-gradient(gainsboro,ghostwhite);
overflow: hidden;
}
header span{
color: dimgray;
position: absolute;
left: 50px;
padding-top: 6px;
font-size: 12px;
font-weight: lighter;
}
.顶部导航 .注册{
color: red;
}
.顶部导航 li{
display: inline-block;
font-size: 12px;
font-weight: lighter;
color:dimgray;
margin: 0px 5px;
vertical-align: top;
}
.顶部导航{
float: right;
position: absolute;
right: 60px;
margin: 6px;
overflow: hidden;
}
.顶部导航 li a{
color: dimgray;
}
.菜单导航 li{
display: inline-block;
margin: 10px;
font-size: 20px;
}
.顶部导航 a:hover{
color: red;
}
header div{
width: 130px;
border: 1px solid lightgray;
position: relative;
top: 30px;
left: -40px;
background-color: white;
display: none;
}
header div p{
text-align: center;
}
header div p a{
color: gray;
font-weight: lighter;
font-size: 10px;
}
.顶部导航 li:nth-child(4){
width: 70px;
}
.顶部导航 li:nth-child(4):hover div{
display: block;
}
section{
margin-top: 30px;
}
.搜索 .loginlogo{
position: relative;
top: 50px;
left: 50px;
}
.搜索 form{
width: 600px;
margin: 0px auto;
position: relative;
top: -20px;
}
.搜索 form input:nth-child(1){
width: 400px;
height: 40px;
border: 2px solid #ff3c3c;
text-indent: 1em;
}
.搜索 form input:nth-child(2){
width: 90px;
height: 40px;
background-color: #ff3c3c;
border: 2px solid #ff3c3c;
margin-left: -5px;
vertical-align: top;
color: white;
font-weight: bolder;
font-size: 17px;
}
.搜索 form ul{
margin-left: -40px;
margin-top: 0px;
}
.搜索 form ul li{
display: inline-block;
padding-right: 10px;
}
.搜索 form ul li a{
font-size: 13px;
color: #57565f;
}
.搜索 span{
padding: 10px 20px;
border: 1px solid gainsboro;
position: relative;
left: 1050px;
top: -80px;
background-color:ghostwhite;
}
.搜索 span a{
color: #57565f;
margin-left: 20px;
}
.分类{
border-bottom: 3px solid orangered;
margin-top: -30px;
margin-left: 20px;
margin-right: 20px;
}
h3{
width: 200px;
padding: 10px 15px;
text-indent: 1em;
background-color: red;
color: white;
float: left;
overflow: hidden;
position: relative;
top: 0px;
}
.分类 img{
position: absolute;
right: 50px;
top: 180px;
}
.分类 nav{
position: relative;
top: 15px;
}
.菜单导航 a{
color: black;
font-weight: bolder;
}
.菜单导航 .hong{
color: red;
}
.左边导航{
width: 229px;
height: 425px;
border: 1px solid red;
background-color: brown;
position: relative;
left: -230px;
overflow: hidden;
}
.左边导航 ul{
float: left;
padding-left: 20px;
margin: 0px;
}
.左边导航 ul li{
line-height: 42px;
font-size: 15px;
color: white;
transition: all 1s ease-in-out;
}
.左边导航 ul li:hover{
transform: translateX(15px);
}
.左边导航 ul li img:nth-child(2){
float: right;
position: relative;
left: 15px;
top: 15px;
}
.中部{
width: 650px;
height: 425px;
margin: 0px auto;
position: relative;
top: -426px;
left: -20px;
}
.中部 img:nth-child(1){
width: 650px;
height: 425px;
}
.中部 img:nth-child(2){
position: relative;
top: -250px;
}
.中部 img:nth-child(3){
position: relative;
top: -250px;
left: 582px;
}
.中部 ul li{
display: inline-block;
margin: 10px;
background-color: gray;
width: 20px;
height: 20px;
text-align: center;
padding: 2px;
border-radius: 15px;
font-weight: bolder;
position: relative;
top: -140px;
left: 240px;
}
.中部 ul li a{
color: black;
}
.中部 ul li:hover{
background-color: tomato;
}
.中部 ul li a:hover{
color: white;
}
.右边导航{
width: 270px;
height: 425px;
border: 1px solid gray;
border-top: none;
position: absolute;
right: 10px;
top: 230px;
}
.one{
width: 270px;;
height: 40px;
border: 1px solid gray;
border-top: none;
}
.one h2{
display: inline;
position: relative;
top: 5px;
left: 15px;
}
.one a{
position: relative;
left: 160px;
color:gray;
}
.one a:hover{
color: red;
}
.two {
width: 270px;
height: 160px;
border: 1px solid gray;
}
.two ul{
position: relative;
left: -50px;
}
.two ul li{
width: 300px;
margin: 20px;
line-height: 10px;
}
.two ul a{
color: gray;
font-weight: lighter;
font-size: 10px;
}
.two span{
font-weight: bolder;
font-size: 13px;
}
.two ul a:hover{
color: red;
}
.thr{
width: 270px;
height: 30px;
border: 1px solid gray;
}
.thr p{
font-size: 18px;
font-weight: bolder;
margin: 5px;
margin-left: 20px;
}
.for{
padding-left: 10px;
}
.for p{
font-size: 13px;
position: relative;
top: -10px;
}
.for img{
width: 250px;
height: 150px;
position: relative;
top: -20px;
}
#nb1 .tu1{
background-color: #d8eefc;
width: 230px;
border: 1px solid gray;
}
#nb1 img{
margin: 20px;
}
#nb1 img:hover{
}
#nb1 .tu1 p{
color: red;
text-align: center;
margin-top: -10px;
}
#nb1 .tu1 p span{
background-color: red;
color: white;
}
.tu2 ul{
display: inline-block;
width: 194px;
height: 300px;
border: 1px solid gray;
margin-top: 10px;
margin-left: -5px;
vertical-align: top;
}
.tu2 ul:nth-child(2){
margin-top: -40px;
}
.tu2 ul li:nth-child(1){
margin-left: -10px;
margin-top: -30px;
}
.tu2 ul li:nth-child(2){
font-weight: bolder;
text-align: center;
text-indent: -2em;
margin-top: -30px;
}
.tu2 ul li:nth-child(2) a{
color: black;
font-size: 13px;
}
.tu2 ul li:nth-child(3) a{
color: gray;
font-size: 12px;
}
.tu2 ul li:nth-child(4){
text-align: center;
text-indent: -3em;
color: gray;
}
.tu2 ul li:nth-child(4) span{
color: red;
font-size: 20px;
font-weight: bolder;
}
.tu2 ul li:nth-child(5){
position: relative;
top: -140px;
left: -50px;
}
.tu2{
position: relative;
left: 235px;
bottom: 150px;
}
.tu2 ul:nth-child(2){
position: relative;
top: -3px;
}
#nb1{
margin-top: -400px;
margin-left: 20px;
}
.aaa{
width: 1175px;
margin-left: 20px;
position: relative;
bottom: 270px;
}
#nb2{
width: 1180px;
height: 50px;
border-bottom: orangered solid 2.5px;
margin-top: -270px;
margin-left: 19px;
}
#nb2 p{
float: left;
margin-left: 10px;
margin-top: 10px;
}
#nb2 p span b{
font-weight: bolder;
font-size: 30px;
}
#nb2 ul{
float: right;
margin-top: 5px;
margin-right: 10px;
}
#nb2 p span{
margin: 10px;
color: orangered;
font-size: 23px;
}
#nb2 p span:nth-child(1){
font-size: 18px;
color: white;
}
#nb2 p{
background: url("images/floor.png") no-repeat 7px 2px;
}
#nb2 ul li{
display: inline-block;
margin: 10px;
}
#nb2 ul li a{
color: black;
font-size: 15px;
font-style: initial;
}
#nb2 ul li a:hover{
color: orangered;
}
#nb3{
width: 1330px;
}
#nb3 .tu1{
width: 212px;
margin-left: 20px;
}
#nb3 .tu1 img{
margin-top: -8px;
}
#nb3 .aa{
width: 172px;
height: 190px;
margin-left: 0px;
margin-top: -10px;
background-color: #d3e6da;
}
#nb3 .aa li{
border-bottom: 2px dotted gray;
margin-left: -37px;
text-indent: 2em;
padding-top: 20px;
}
#nb3 .aa li a{
color: black;
font-size: small;
font-weight: lighter;
line-height: 20px;
}
#nb3 .aa li a:hover{
color: red;
}
#nb3 .tu2{
width: 900px;
position: relative;
top: -485px;
}
#nb3 .bb{
width: 200px;
height: 235px;
margin: -2px;
border-left: none;
border-top: none;
}
#nb3 .tu2 img{
width: 165px;
height: 135px;
}
#nb3 .tu2 .bb li{
margin: 10px;
text-align: center;
text-indent: -3em;
}
#nb3 .tu2 .bb li a{
font-size: 13px;
color: black;
}
#nb3 .tu2 .bb li:nth-child(2){
color: red;
}
#nb3 .tu2 img:hover{
transform: scale(1.2);
transition: all 1s ease-in-out ;
}
#nb3 .tu3{
float: right;
position: relative;
top: -945px;
right: 130px;
}
#nb3 .tu3 img{
width: 250px;
height: 236px;
margin: -5px;
}
#nb4{
width: 1190px;
height: 50px;
border-bottom: orangered solid 2.5px;
position: relative;
top: -470px;
margin-left: 19px;
}
#nb4 p{
float: left;
margin-left: 10px;
margin-top: 10px;
}
#nb4 p span b{
font-weight: bolder;
font-size: 30px;
}
#nb4 ul{
float: right;
margin-right: -120px;
margin-top: 5px;
}
#nb4 p span{
margin: 10px;
color: orangered;
font-size: 23px;
}
#nb4 p span:nth-child(1){
font-size: 18px;
color: white;
}
#nb4 p{
background: url("images/floor.png") no-repeat 7px -2px;
}
#nb4 ul li{
display: inline-block;
margin: 10px;
}
#nb4 ul li a{
color: black;
font-size: 15px;
font-style: initial;
}
#nb4 ul li a:hover{
color: orangered;
}
#nb5{
width: 1330px;
position: relative;
top: -877px;
}
#nb5 .tu1{
width: 212px;
margin-left: 20px;
}
#nb5 .tu1 img{
width: 220px;
height: 290px;
margin-bottom: 5px;
}
#nb5 .aa{
width: 172px;
height: 190px;
margin-left: 0px;
margin-top: -10px;
background-color: #d3e6da;
}
#nb5 .aa li{
border-bottom: 2px dotted gray;
margin-left: -37px;
text-indent: 2em;
padding-top: 20px;
}
#nb5 .aa li a{
color: black;
font-size: small;
font-weight: lighter;
line-height: 20px;
}
#nb5 .aa li a:hover{
color: red;
}
#nb5 .tu2{
width: 900px;
position: relative;
top: -485px;
}
#nb5 .bb{
width: 200px;
height: 235px;
margin: -2px;
border-left: none;
border-top: none;
}
#nb5 .tu2 img{
width: 165px;
height: 135px;
}
#nb5 .tu2 .bb li{
margin: 10px;
text-align: center;
text-indent: -3em;
}
#nb5 .tu2 .bb li a{
font-size: 15px;
color: black;
}
#nb5 .tu2 .bb li:nth-child(2){
color: red;
}
#nb5 .tu2 img:hover{
transform: scale(1.2);
transition: all 1s ease-in-out ;
}
#nb5 .tu3{
float: right;
position: relative;
top: -945px;
right: 120px;
}
#nb5 .tu3 img{
width: 250px;
height: 236px;
margin: -5px;
}
.qqq{
width: 1200px;
position: relative;
bottom:1810px;
left: 20px;
}
#nb6{
width: 1200px;
height: 50px;
border-bottom: orangered solid 2.5px;
position: relative;
top: -1810px;
margin-left: 19px;
}
#nb6 p{
float: left;
margin-left: 10px;
margin-top: 10px;
}
#nb6 p span b{
font-weight: bolder;
font-size: 30px;
}
#nb6 ul{
float: right;
margin-right: 10px;
margin-top: 5px;
}
#nb6 p span{
margin: 10px;
color: orangered;
font-size: 23px;
}
#nb6 p span:nth-child(1){
font-size: 18px;
color: white;
}
#nb6 p{
background: url("images/floor.png") no-repeat 7px -2px;
}
#nb6 ul li{
display: inline-block;
margin: 10px;
}
#nb6 ul li a{
color: black;
font-size: 15px;
font-style: initial;
}
#nb6 ul li a:hover{
color: orangered;
}
#nb7{
width: 1330px;
position: relative;
top: -1810px;
}
#nb7 .tu1{
width: 212px;
margin-left: 20px;
}
#nb7 .tu1 img{
width: 210px;
height: 280px;
margin-bottom: 5px;
}
#nb7 .aa{
width: 172px;
height: 190px;
margin-left: 0px;
margin-top: -10px;
background-color: #d3e6da;
}
#nb7 .aa li{
border-bottom: 2px dotted gray;
margin-left: -37px;
text-indent: 2em;
padding-top: 20px;
}
#nb7 .aa li a{
color: black;
font-size: small;
font-weight: lighter;
line-height: 20px;
}
#nb7 .aa li a:hover{
color: red;
}
#nb7 .tu2{
width: 900px;
position: relative;
top: -485px;
}
#nb7 .bb{
width: 200px;
height: 235px;
margin: -2px;
border-left: none;
border-top: none;
}
#nb7 .tu2 img{
width: 165px;
height: 135px;
}
#nb7 .tu2 .bb li{
margin: 10px;
text-align: center;
text-indent: -3em;
}
#nb7 .tu2 .bb li a{
font-size: 15px;
color: black;
}
#nb7 .tu2 .bb li:nth-child(2){
color: red;
}
#nb7 .tu2 img:hover{
transform: scale(1.2);
transition: all 1s ease-in-out ;
}
#nb7 .tu3{
float: right;
position: relative;
top: -945px;
right: 120px;
}
#nb7 .tu3 img{
width: 250px;
height: 236px;
margin: -5px;
}
#nb8{
width: 1200px;
position: relative;
left: 100px;
top: -2280px;
}
#nb8 ul{
display: inline-block;
margin: 40px;
}
#nb8 ul li:nth-child(1){
text-align: center;
}
#nb8 ul li:nth-child(2){
text-align: center;
font-weight: bolder;
font-size: 20px;
}
#nb8 ul li:nth-child(3){
font-weight: lighter;
color: gray;
}
#nb8 img{
transition: all 3s ease-in-out;
}
#nb8 img:hover{
transform: rotate(360deg);
}
#nb9{
width: 1200px;
height: 230px;
border-bottom: 1px solid gray;
position:relative;
top: -2300px;
left: 20px;
}
#nb9 dl{
display: inline-block;
width: 150px;
height: 200px;
vertical-align: top;
margin-left: 10px;
}
#nb9 dl dt {
text-indent: 2.5em;
margin-bottom: 20px;
font-weight: bolder;
}
#nb9 dl dt a{
color: black;
}
#nb9 dl dt a:hover{
text-decoration:underline;
}
#nb9 dl dd a{
font-weight: lighter;
font-size: 13px;
line-height: 30px;
color: black;
}
#nb9 dl dd a:hover{
color: red;
}
#nb9 .las{
position: relative;
left: 850px;
top: -230px;
}
#nb9 .las img:nth-child(1){
float: left;
margin-right: 20px;
}
#nb9 .las ul li{
line-height: 30px;
}
#nb9 .las ul a{
color: gray;
margin-left: -10px;
}
#nb9 .las ul a:hover{
color: red;
}
#nb9 .las ul li:nth-child(2){
position: relative;
top: 10px;
}
#nb9 .las ul li:nth-child(3){
font-size: 13px;
position: relative;
top: 15px;
}
#nb9 .las ul li:nth-child(4){
font-size: 25px;
color: red;
}
section{
width: 1200px;
height: 3300px;
overflow: hidden;
position: relative;
top: 10px;
}
footer{
margin-bottom: 10px;
}
#sb p {
font-size: 12px;
text-align: center;
}
#sb ul{
margin-left: 100px;
}
#sb ul li{
display: inline-block;
}
#sb ul li img{
width: 98px;
height: 33px;
border: 1px solid gainsboro;
border-radius: 8px;
position: relative;
left: 100px;
}
#sb{
width: 1200px;
height: 40px;
}
</style>
</head>
<body>
<header>
<span>送货至：湖南衡阳</span>
<ul class="顶部导航">
<li>你好! 请<a href="#">登录 </a><a href="#" class="注册">免费注册</a>|</li>
<li><a href="#">我的订单</a> </li>
<li><a href="#">收藏夹 </a><img src="../img/t_arrow.gif"> |</li>
<li><a href="#">客户服务</a><img src="../img/t_arrow.gif">
<div>
<p><a href="#">客服服务</a></p>
<p><a href="#">客服服务</a></p>
<p><a href="#">客服服务</a></p>
</div></li>
<li><a href="#">| 网站导航</a><img src="../img/t_arrow.gif">|</li>
<li>关注我们：<a href="#"><img src="../img/sh1.png"></a> <a href="#"><img src="../img/sh2.png"></a> |</li>
<li><a href="#"> 手机版</a> <img src="../img/s_tel.png"> </li>
</ul>
</header>
<section>
<div class="搜索">
<img class="loginlogo" src="../img/logo.png">
<form method="get" action="#">
<a href="搜索页面.html" target="_blank" style="border: none">
<input type="search" placeholder="请输入关键字">
<input type= submit value="搜索" ></a>
<ul>
<li><a href= "搜索页面.html" target="_blank">咖啡</a> </li>
<li><a href="搜索页面.html" target="_blank"> iphone 6S</a> </li>
<li><a href="搜索页面.html" target="_blank">新鲜美食</a> </li>
<li><a href="搜索页面.html" target="_blank">蛋糕</a> </li>
<li><a href="搜索页面.html" target="_blank">日用品</a> </li>
<li><a href="搜索页面.html" target="_blank">连衣裙</a> </li>
</ul>
</form>
<span>
<img src="../img/car.png"><a href="#">购物车</a>
</span>
</div>
<div class="分类">
<h3>全部商品分类</h3>
<nav>
<ul class="菜单导航">
<li ><a href="#" class="hong">首页</a></li>
<li ><a href="#" class="hong">自营超市</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>
<img src="../img/phone.png">
</div>
<div class="左边导航">
<ul>
<li><img src="../img/nav1.png"> 进口食品、生鲜<img src="images/n_arrow.gif"></li>
<li><img src="../img/nav2.png"> 食品、饮料、酒<img src="images/n_arrow.gif"></li>
<li><img src="../img/nav3.png"> 母婴、玩具、童装<img src="images/n_arrow.gif"></li>
<li><img src="../img/nav4.png"> 家居、家庭清洁、纸品<img src="images/n_arrow.gif"></li>
<li><img src="../img/nav5.png"> 美妆、个人护理、洗护<img src="images/n_arrow.gif"></li>
<li><img src="../img/nav6.png"> 女装、内衣、中老年<img src="images/n_arrow.gif"></li>
<li><img src="../img/nav7.png"> 鞋靴、箱包、腕表配饰<img src="images/n_arrow.gif"></li>
<li><img src="../img/nav8.png"> 男装、运动<img src="images/n_arrow.gif"></li>
<li><img src="../img/nav9.png"> 手机、小家电、电脑<img src="images/n_arrow.gif"></li>
<li><img src="../img/nav10.png"> 礼品、充值<img src="images/n_arrow.gif"></li>
</ul>
</div>
<div class="中部">
<img src="../img/ban1.jpg">
<img src="../img/b_left.png">
<img src="../img/b_right.png">
<ul>
<li><a href="#">1</a> </li>
<li><a href="#">2</a> </li>
<li><a href="#">3</a> </li>
</ul>
</div>
<div class="右边导航">
<div class="one">
<h2>快讯</h2>
<a href="#">更多></a>
</div>
<div class="two">
<ul>
<li><span>【特惠】</span><a href="#">掬一轮明月 表无尽惦念</a> </li>
<li><span>【公告】</span><a href="#">好奇金装成长裤新品上市</a> </li>
<li><span>【特惠】</span><a href="#">大牌闪购 · 抢！</a> </li>
<li><span>【公告】</span><a href="#">发福利 买车就抢千元油卡</a> </li>
<li><span>【公告】</span><a href="#">家电低至五折</a> </li>
</ul>
</div>
<div class="thr">
<p>1号钱包</p>
</div>
<div class="for">
<p>收益日结，收益赚High！</p>
<img src="../img/oneAD.jpg">
</div>
</div>
<div id="nb1">
<div class="tu1">
<img src="../img/l_img.jpg">
<p>
<span>￥53.00</span> 16R
</p>
</div>
<div class="tu2">
<ul>
<li><img src="../img/hot1.jpg"></li>
<li><a href="#">德国进口</a> </li>
<li><a href="#">德亚全脂纯牛奶200ml*48盒 </a> </li>
<li><span>￥189</span> 26R </li>
<li><img src="../img/hot.png" class="bbb"></li>
</ul>
<ul>
<li><img src="../img/hot2.jpg"></li>
<li><a href="#">iphone 6S</a> </li>
<li><a href="#">Apple/苹果 iPhone 6s Plus公开版</a> </li>
<li><span>￥5288</span> 25R </li>
<li><img src="../img/hot.png" class="bbb"></li>
</ul>
<ul>
<li><img src="../img/hot3.jpg"></li>
<li><a href="#">倩碧特惠组合套装</a> </li>
<li><a href="#">倩碧补水组合套装8折促销</a> </li>
<li><span>￥368</span> 18R </li>
<li><img src="../img/hot.png" class="bbb"></li>
</ul>
<ul>
<li><img src="../img/hot4.jpg"></li>
<li><a href="#">品利特级橄榄油</a> </li>
<li><a href="#">750ml*4瓶装组合 西班牙原装进口</a> </li>
<li><span>￥280</span> 30R </li>
<li><img src="../img/hot.png" class="bbb"></li>
</ul>
</div>
</div>
<img src="images/mban_2.jpg" class="aaa">
<div id="nb2">
<p>
<span>1F</span>
<span>进口<b>·</b>生鲜</span>
</p>
<ul>
<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>
</div>
<div id="nb3">
<div class="tu1">
<img src="images/fre_r.jpg">
<ul class="aa">
<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></li>
</ul>
</div>
<div class="tu2">
<ul class="bb">
<li><a href="#">贝思客 草莓先生&蓝莓小姐</a> </li>
<li>￥98.00</li>
<li><img src="../img/fre_1.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">微笑果园SMILE 智利进口绿奇异果</a> </li>
<li>￥84.00</li>
<li><img src="../img/fre_2.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">新鲜美味 进口美食</a></li>
<li>￥98.00</li>
<li><img src="../img/fre_3.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">新鲜美味 进口美食</a></li>
<li>￥24.00</li>
<li><img src="../img/fre_4.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">新鲜美味 纯牛奶</a></li>
<li>￥142.00</li>
<li><img src="../img/fre_5.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">莫斯利安</a></li>
<li>￥62.00</li>
<li><img src="../img/fre_6.jpg"></li>
</ul>
</div>
<div class="tu3">
<img src="../img/fre_b1.jpg"><br>
<img src="../img/fre_b2.jpg">
</div>
</div>
<div id="nb4">
<p>
<span>2F</span>
<span>个人美妆</span>
</p>
<ul>
<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>
</div>
<div id="nb5">
<div class="tu1">
<img src="../img/make_r.jpg">
<ul class="aa">
<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>
</ul>
</div>
<div class="tu2">
<ul class="bb">
<li><a href="#">美宝莲粉饼</a> </li>
<li>￥260.00</li>
<li><img src="../img/make_1.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">洗衣液</a> </li>
<li>￥60.00</li>
<li><img src="../img/make_2.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">洗发水</a></li>
<li>￥160.00</li>
<li><img src="../img/make_3.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">男士洗发水</a></li>
<li>￥120.00</li>
<li><img src="../img/make_4.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">美宝莲粉饼</a></li>
<li>￥260.00</li>
<li><img src="../img/make_5.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">男士设计 洗面奶</a></li>
<li>￥90.00</li>
<li><img src="../img/make_6.jpg"></li>
</ul>
</div>
<div class="tu3">
<img src="../img/make_b1.jpg"><br>
<img src="../img/make_b2.jpg">
</div>
</div>
<img src="../img/mban_2.jpg" class="qqq">
<div id="nb6">
<p>
<span>3F</span>
<span>母婴玩具</span>
</p>
<ul>
<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>
</div>
<div id="nb7">
<div class="tu1">
<img src="../img/baby_r.jpg">
<ul class="aa">
<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>
</ul>
</div>
<div class="tu2">
<ul class="bb">
<li><a href="#">儿童推车</a> </li>
<li>￥560.00</li>
<li><img src="../img/baby_2.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">妈咪纸尿裤</a> </li>
<li>￥260.00</li>
<li><img src="../img/baby_3.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">儿童玩具 挖掘机</a></li>
<li>￥160.00</li>
<li><img src="../img/baby_4.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">纸尿裤</a></li>
<li>￥260.00</li>
<li><img src="../img/baby_5.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">儿童推车</a></li>
<li>￥86.00</li>
<li><img src="../img/baby_6.jpg"></li>
</ul>
<ul class="bb">
<li><a href="#">奶粉</a></li>
<li>￥660.00</li>
<li><img src="../img/baby_6.jpg"></li>
</ul>
</div>
<div class="tu3">
<img src="../img/ca_2.jpg"><br>
<img src="../img/ca_4.jpg">
</div>
</div>
<div id="nb8">
<ul>
<li><img src="../img/b1.png"></li>
<li>正品保障</li>
<li>正品行货 放心购买</li>
</ul>
<ul>
<li><img src="../img/b2.png"></li>
<li>满38包邮</li>
<li>满38包邮 免运费</li>
</ul>
<ul>
<li><img src="../img/b3.png"></li>
<li>天天低价</li>
<li>天天低价 畅选无忧</li>
</ul>
<ul>
<li><img src="../img/b4.png"></li>
<li>准时送达</li>
<li>收货时间由你做主</li>
</ul>
</div>
<div id="nb9">
<dl>
<dt><a href="#">新手上路</a> </dt>
<dd><a href="#">售后流程</a></dd>
<dd><a href="#">购物流程</a></dd>
<dd><a href="#">订购方式</a></dd>
<dd><a href="#">隐私声明</a></dd>
<dd><a href="#">推荐分享说明</a></dd>
</dl>
<dl>
<dt><a href="#">配送与支付</a> </dt>
<dd><a href="#">货到付款区域</a></dd>
<dd><a href="#">配送支付查询</a></dd>
<dd><a href="#">支付方式说明</a></dd>
</dl>
<dl>
<dt><a href="#">会员中心</a> </dt>
<dd><a href="#">资金管理</a></dd>
<dd><a href="#">我的收藏</a></dd>
<dd><a href="#">我的订单</a></dd>
</dl>
<dl>
<dt><a href="#">服务保证</a> </dt>
<dd><a href="#">退换货原则</a></dd>
<dd><a href="#">售后服务保证</a></dd>
<dd><a href="#">产品质量保证</a></dd>
</dl>
<dl>
<dt><a href="#">联系我们</a> </dt>
<dd><a href="#">网站故障报告</a></dd>
<dd><a href="#">购物咨询</a></dd>
<dd><a href="#">投诉与建议</a></dd>
</dl>
<div class="las">
<img src="../img/er.gif" >
<ul>
<li><img src="../img/sh1.png"><a href="#">新浪微博</a> </li>
<li><img src="../img/b_sh_2.png"><a href="#">腾讯微博</a> </li>
<li><p>服务热线：</p></li>
<li><span>400-123-4567</span></li>
</ul>
<img src="../img/ss.png">
</div>
</div>
</section>
<footer>
<div id="sb">
<p>备案/许可证编号：蜀ICP备12009302号-1-www.dingguagua Copyright© 1号店网
上超市 2007-2016，All Rights Reserved. 复制必究 , Technical Support: Dgg
Group</p>
<ul>
<li><img src="../img/b_1.gif"></li>
<li><img src="../img/b_2.gif"></li>
<li><img src="../img/b_3.gif"></li>
<li><img src="../img/b_4.gif"></li>
<li><img src="../img/b_5.gif"></li>
<li><img src="../img/b_6.gif"></li>
</ul>
</div>
</footer>
</body>
</html>
更多推荐
一号店项目 完整版 代码自取
发布评论