宠喵club商城 - 走看看

zoukankan html css js c++ java

宠喵club商城

我们一阶段学习完成，现在小组开始做项目，我们做的是宠物猫的网站，包括品种，商城，流浪猫等内容，我负责的是商城这方面，历经几天终于把页面做了出来，页面包括轮播和图片放大等特效，代码如下：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link rel="shortcut icon" href="img/www.ico.la_65e2dbdc4ba7689767c152dc98d4c1a8_16X16.ico" type="image/x-icon"/>
<link rel="icon" href="img/www.ico.la_65e2dbdc4ba7689767c152dc98d4c1a8_16X16.ico" type="image/x-icon"/>

<title>宠喵club 商城</title>
<style>

* {
margin:0px;
padding:0px;

}

#top1 {
100%;
height:35px;
/*border:1px solid black;*/
border-bottom:0.1px solid #9E9E9E;
}
.top1 {
600px;
height:35px;
/*border:1px solid black;*/
margin-left:10px;
text-align:center;
line-height:35px;
float:left;

}
.top2 {
300px;
height:35px;
/*border:1px solid black;*/
margin-left:410px;
text-align:center;
line-height:35px;
float:left;

}

.top1 a:hover {
cursor: pointer;
color:red;
}
a:link {
color:black;
}

.top2 a:hover{
cursor: pointer;
color:red;
}
.top3 {
100%;
height:130px;
/*border:1px solid black;*/
float:left;

}
.top4 {
260px;
height:100px;
/*border:1px solid black;*/
margin-top:0px;
margin-left:55px;
float:left;
margin-top:3px;
}
.tx {
498px;
height:40px;
border:1px solid red;
float:left;
margin-top:55px;
margin-left:50px;

}
.wenben {
background: #f65;
height: 43px;
92px;
cursor: pointer;
float: left;
font: 18px/34px "Microsoft YaHei";
color: #fff;
border: none;
margin-top:55px;
}
.top5 {
450px;
height:35px;
/*border:1px solid black;*/
margin-top:95px;
margin-left:364px;
line-height:35px;
font-family: SimSun;
font-size: 14px;
color:#999;
text-decoration: none;
}
.top5-right {
180px;
height:40px;
/*border:1px solid black;*/
float: left;
margin-left:1113px;
margin-top:-80px;
}
.dhh {
100%;
height:50px;
/*border:1px solid black;*/
float: left;
background-color:#EE3B3B;
}
.dhh1, .dhh2, .dhh3, .dhh4, .dhh5, .dhh6 {
130px;
height:50px;
/*border:1px solid black;*/
float:left;
text-align:center;
line-height:50px;

border-right:0.3px solid #9E9E9E;
color: #FFF;
font: 18px/44px "Microsoft YaHei";

}
.dhh1:hover, .dhh2:hover, .dhh3:hover, .dhh4:hover, .dhh5:hover, .dhh6:hover {
cursor: pointer;
background-color:#EE0000;
}
.dhh1 {
margin-left:50px;
}
.dhh7 {
140px;
height:50px;
/*border:1px solid black;*/
float:left;
margin-left:310px;
text-align:center;
line-height:50px;
color:white;
font: 18px/44px "Microsoft YaHei";

}
.dhh7:hover {
cursor: pointer;
background-color:#EE0000;
}
.center1 {
100%;
height:540px;

}
.center1-1 {
margin:0px auto;
60%;
height:540px;

}
.centerout {
100%;
height:2200px;

}
.c2 {
1243px;
height:40px;

margin:0px auto;
}
.c22 {
200px;
height:30px;
margin:6px 0px 0px 0px;
color:red;
font-size:20px;
}
.c3 {
1243px;
height:425px;
border:1px solid #DCDCDC;
margin:0px auto;
border-top-color:orange;
}
.c31 {
188px;
height:424px;
border:1px solid #DCDCDC;
float:left;
border-top-color:orange;
}
.c32 {
849px;
height:424px;
border:1px solid #DCDCDC;
float:left;
border-top-color:orange;

}
.c33 {
200px;
height:424px;
border:1px solid #DCDCDC;
float:left;
border-top-color:orange;
}
.c311 {
188px;
height:70px;

}
.c312 {
188px;
height:138px;
border:1px solid #DCDCDC;
line-height:138px;
text-align:center;
font-size:18px;
background-color:#F5F5F5;
}
.c313 {
188px;
height:131px;
border:1px solid #DCDCDC;
line-height:131px;
text-align:center;
font-size:18px;
background-color:#F5F5F5;
}
.c314 {
188px;
height:79px;
border:1px solid #DCDCDC;
line-height:85px;
text-align:center;
background-color:#F5F5F5;
}
.c312:hover {
cursor:pointer;
background-color:white;
}
.c313:hover {
cursor:pointer;
background-color:white;
}
.c314:hover {
cursor:pointer;
background-color:white;
}
.c321 {
849px;
height:210px;
border:1px solid #DCDCDC;
border-bottom:none;

}
.c322 {
849px;
height:210px;
border:1px solid #DCDCDC;
border-top:none;
border-bottom:none;
}
.c3211, .c3212, .c3213, .c3214 {
210px;
height:210px;
border:0.5px solid #DCDCDC;
float:left;
font-size:13px;
text-align:center;
border:none;

}
.c3221, .c3222, .c3223, .c3224 {
210px;
height:210px;
border:0.5px solid #DCDCDC;
float:left;
font-size:13px;
text-align:center;
border:none;
}
.c331 {
190px;
height:140px;

margin-left:10px;
margin-top:8px;
}
.c332 {
190px;
height:270px;

margin-left:10px;
margin-top:7px;
}
.c4 {
1243px;
height:425px;
border:1px solid #DCDCDC;
margin:0px auto;
border-top-color:#008B8B;
margin-top:40px;
}

.c41 {
188px;
height:424px;
border:1px solid #DCDCDC;
float:left;
border-top-color:#008B8B;
}
.c42 {
849px;
height:424px;
border:1px solid #DCDCDC;
float:left;
border-top-color:#008B8B;

}
.c43 {
200px;
height:424px;
border:1px solid #DCDCDC;
float:left;
border-top-color:#008B8B;
}
.c411 {
188px;
height:70px;

}
.c412 {
188px;
height:138px;
border:1px solid #DCDCDC;
line-height:138px;
text-align:center;
font-size:18px;
background-color:#F5F5F5;
}
.c413 {
188px;
height:131px;
border:1px solid #DCDCDC;
line-height:131px;
text-align:center;
font-size:18px;
background-color:#F5F5F5;
}
.c414 {
188px;
height:79px;
border:1px solid #DCDCDC;
line-height:85px;
text-align:center;
background-color:#F5F5F5;
}
.c412:hover, .c413:hover, .c414:hover {
cursor:pointer;
background-color:white;
}
.c421 {
849px;
height:210px;
border:1px solid #DCDCDC;
border-bottom:none;

}
.c422 {
849px;
height:210px;
border:1px solid #DCDCDC;
border-top:none;
border-bottom:none;
}
.c4211, .c4212, .c4213, .c4214 {
210px;
height:210px;
border:0.5px solid #DCDCDC;
float:left;
font-size:13px;
text-align:center;
border:none;
}
.c4221, .c4222, .c4223, .c4224 {
210px;
height:210px;
border:0.5px solid #DCDCDC;
float:left;
font-size:13px;
text-align:center;
border:none;
}
.c431 {
190px;
height:140px;

margin-left:10px;
margin-top:8px;
}
.c432 {
190px;
height:270px;

margin-left:10px;
margin-top:7px;
}
.c5 {
1243px;
height:425px;
border:1px solid #DCDCDC;
margin:0px auto;
border-top-color:red;
margin-top:40px;
}

.c51 {
188px;
height:424px;
border:1px solid #DCDCDC;
float:left;
border-top-color:red;
}
.c52 {
849px;
height:424px;
border:1px solid #DCDCDC;
float:left;
border-top-color:red;

}
.c53 {
200px;
height:424px;
border:1px solid #DCDCDC;
float:left;
border-top-color:red;
}
.c511 {
188px;
height:70px;

}
.c512 {
188px;
height:138px;
border:1px solid #DCDCDC;
line-height:138px;
text-align:center;
font-size:18px;
background-color:#F5F5F5;
}
.c513 {
188px;
height:131px;
border:1px solid #DCDCDC;
line-height:131px;
text-align:center;
font-size:18px;
background-color:#F5F5F5;
}
.c514 {
188px;
height:79px;
border:1px solid #DCDCDC;
line-height:85px;
text-align:center;
background-color:#F5F5F5;
}
.c512:hover, .c513:hover, .c514:hover {
cursor:pointer;
background-color:white;
}
.c521 {
849px;
height:210px;
border:1px solid #DCDCDC;
border-bottom:none;

}
.c522 {
849px;
height:210px;
border:1px solid #DCDCDC;
border-top:none;
border-bottom:none;
}
.c5211, .c5212, .c5213, .c5214 {
210px;
height:210px;
border:0.5px solid #DCDCDC;
float:left;
font-size:13px;
text-align:center;
border:none;
}
.c5221, .c5222, .c5223, .c5224 {
210px;
height:210px;
border:0.5px solid #DCDCDC;
float:left;
font-size:13px;
text-align:center;
border:none;
}
.c531 {
190px;
height:140px;

margin-left:10px;
margin-top:8px;
}
.c532 {
190px;
height:270px;

margin-left:10px;
margin-top:7px;
}
.c6 {
1243px;
height:425px;
border:1px solid #DCDCDC;
margin:0px auto;
border-top-color:blue;
margin-top:40px;
}

.c61 {
188px;
height:424px;
border:1px solid #DCDCDC;
float:left;
border-top-color:blue;
}
.c62 {
849px;
height:424px;
border:1px solid #DCDCDC;
float:left;
border-top-color:blue;

}
.c63 {
200px;
height:424px;
border:1px solid #DCDCDC;
float:left;
border-top-color:blue;
}
.c611 {
188px;
height:70px;

}
.c612 {
188px;
height:138px;
border:1px solid #DCDCDC;
line-height:138px;
text-align:center;
font-size:18px;
background-color:#F5F5F5;
}
.c613 {
188px;
height:131px;
border:1px solid #DCDCDC;
line-height:131px;
text-align:center;
font-size:18px;
background-color:#F5F5F5;
}
.c614 {
188px;
height:79px;
border:1px solid #DCDCDC;
line-height:85px;
text-align:center;
background-color:#F5F5F5;
}
.c612:hover, .c613:hover, .c614:hover {
cursor:pointer;
background-color:white;

}
.c621 {
849px;
height:210px;
border:1px solid #DCDCDC;
border-bottom:none;

}
.c622 {
849px;
height:210px;
border:1px solid #DCDCDC;
border-top:none;
border-bottom:none;
}
.c6211, .c6212, .c6213, .c6214 {
210px;
height:210px;
border:0.5px solid #DCDCDC;
float:left;
font-size:13px;
text-align:center;
border:none;
}
.c6221, .c6222, .c6223, .c6224 {
210px;
height:210px;
border:0.5px solid #DCDCDC;
float:left;
font-size:13px;
text-align:center;
border:none;
}
.c631 {
190px;
height:140px;

margin-left:10px;
margin-top:8px;
}
.c632 {
190px;
height:270px;

margin-left:10px;
margin-top:7px;
}
.bottomdhh {
100%;
height:121px;
border:1px solid black;
float:left;
margin-top:30px;

}
a {
text-decoration: none;
color:black;
}
a:hover {
color:red;
}
.c3211 img,.c3212 img,.c3213 img,.c3214 img{
cursor: pointer;
transition: all 0.3s;

}
.c3211 img:hover,.c3212 img:hover,.c3213 img:hover,.c3214 img:hover{
transform: scale(1.1);
}
.c322 img {
cursor: pointer;
transition: all 0.3s;
}
.c322 img:hover {
transform: scale(1.1);
}
.c421 img {
cursor: pointer;
transition: all 0.3s;
}
.c421 img:hover {
transform: scale(1.1);
}
.c422 img {
cursor: pointer;
transition: all 0.3s;
}
.c422 img:hover {
transform: scale(1.1);
}
.c521 img {
cursor: pointer;
transition: all 0.3s;
}
.c521 img:hover {
transform: scale(1.1);
}
.c522 img {
cursor: pointer;
transition: all 0.3s;
}
.c522 img:hover {
transform: scale(1.1);
}
.c621 img {
cursor: pointer;
transition: all 0.3s;
}
.c621 img:hover {
transform: scale(1.1);
}
.c622 img {
cursor: pointer;
transition: all 0.3s;
}
.c622 img:hover {
transform: scale(1.1);
}
.c33 img,.c43 img,.c53 img,.c63 img {
cursor: pointer;
transition: all 0.3s;
}
.c33 img:hover,.c43 img:hover,.c53 img:hover,.c63 img:hover {
transform: scale(1.1);
}
.top5 span a {
color:#999;
}
.top5 span a:hover {
color:red;
}
.biao {
1243px;
height:170px;
/*border:1px solid black;*/
float:left;
margin-left:55px;
border-bottom:0.5px solid gray;
}
.biao1{
345px;
height:143px;
/*border:1px solid black;*/
float:left;
margin-top:15px;

}
.biao2{
140px;
height:154px;
/*border:1px solid black;*/
float:left;
margin-left:420px;
margin-top:-160px;

font-size:15px; font-weight:500
}
ul {
list-style:none;
}
.li {
text-align:center;
padding-top:5px;
}
.biao5 {
140px;
height: 154px;
/*border: 1px solid black;*/
float: left;
margin-left: 560px;
margin-top: -160px;
font-size: 15px;
font-weight: 500;
}
.biao6 {
140px;
height: 154px;
/*border: 1px solid black;*/
float: left;
margin-left: 700px;
margin-top: -160px;
font-size: 15px;
font-weight: 500;
}
.biao7 {
140px;
height: 154px;
/*border: 1px solid black;*/
float: left;
margin-left: 840px;
margin-top: -160px;
font-size: 15px;
font-weight: 500;
}
.biao8 {
140px;
height: 154px;
/*border: 1px solid black;*/
float: left;
margin-left: 1000px;
margin-top: -160px;
font-size: 15px;
font-weight: 500;
}
.biao9 {
140px;
height: 154px;
/*border: 1px solid black;*/
float: left;
margin-left: 1140px;
margin-top: -160px;
font-size: 15px;
}
.youhui {
text-align:center;
margin-top:-15px;

}
.biao3 {
844px;
height:50px;
/*border:1px solid black;*/
float:left;
border-bottom:0.5px solid gray;
margin-top:10px;
margin-left:250px;
}
.biao4 {
844px;
height:50px;
/*border:1px solid black;*/
float:left;
margin-left:450px;
}
.pj-Carousel { 800px; height: 400px; margin:0px auto; overflow: hidden; position: relative; } /*相框宽度，位置*/
.pj-Carousel-box { height: 500px; position: absolute; top: 0; left: 0; }
.pj-Carousel-item { float: left; height: 300px; background-color: #E3E3E3; text-align: center; line-height: 300px; font-family: "Arial Black"; color: #979797; font-size: 40px; }
.pj-Carousel-active { position: absolute; bottom: 40px; margin: auto auto; z-index: 5; }
.pj-Carousel-color { background-color: #A2A2A2; 14px; height: 14px; border-radius: 50%; float: left; margin: 0px 5px; }
.pj-Carousel .active { background-color: #272727; }

</style>

</head>
<body>
<div id="top1">
<div class="top1">
<a href="一阶段项目spx.html" style="text-decoration: none;" target="_blank" >ฅ'ω'ฅ ฅ'ω'ฅ 网   </a>
<a href="一阶段项目spx.html" style="text-decoration: none;"target="_blank" > ฅ'ω'ฅ 商城   </a>
<a href="一阶段项目spx.html" style="text-decoration: none; "target="_blank" > ฅ'ω'ฅ 服务   </a>
<a href="一阶段项目spx.html" style="text-decoration: none; " target="_blank"> ฅ'ω'ฅ 论坛   </a>
<a href="一阶段项目spx.html" style="text-decoration: none; " target="_blank"> ฅ'ω'ฅ 百科   </a>
</div>
<div class="top2">
<a href="一阶段项目spx.html" style="text-decoration: none; "target="_blank" > 登录   </a>
<a href="一阶段项目spx.html" style="text-decoration: none; " target="_blank">注册   </a>
<a href="一阶段项目spx.html" style="text-decoration: none; "target="_blank" >微博   </a>
<a href="一阶段项目spx.html" style="text-decoration: none; " target="_blank">微信   </a>
<a href="一阶段项目spx.html" style="text-decoration: none;" target="_blank">手机版   </a>
</div>

</div>
<div class="top3">
<div class="top4">
<img src="img/catlogo1.jpg"/> </div>
<input type="text" class="tx" id="d1" name="text"/>
<input type="submit" class="wenben" id="button" name="button" value="搜索"/>
<div class="top5">
热门搜索：
<span><a href="http://" target="_blank" style="text-decoration: none;"> ฅ'ω'ฅ粮</a>
<a href="http://" target="_blank" style="text-decoration: none;"> ฅ'ω'ฅ商城</a>
<a href="http://" target="_blank" style="text-decoration: none;">金猫</a>
<a href="http://" target="_blank" style="text-decoration: none;">金吉拉</a></span>
</div>
<div class="top5-right">
<img src="img/ad2.gif"/>
</div>
</div>
<div class="dhh">
<div class="dhh1" style="margin-left:55px;"><a href="一阶段项目spx.html" style="text-decoration: none; color: #FFF;">首页</a></div>
<div class="dhh2"><a href="一阶段项目spx.html" style="text-decoration: none;color: #FFF "target="_blank">种类</a></div>
<div class="dhh3"><a href="一阶段项目spx.html" style="text-decoration: none;color: #FFF "target="_blank">ฅ'ω'ฅ商城</a></div>
<div class="dhh4"><a href="一阶段项目spx.html" style="text-decoration: none;color: #FFF "target="_blank">ฅ'ω'ฅ医生</a></div>
<div class="dhh5"><a href="一阶段项目spx.html" style="text-decoration: none;color: #FFF "target="_blank">ฅ'ω'ฅ天下</a></div>
<div class="dhh6"><a href="一阶段项目spx.html" style="text-decoration: none;color: #FFF"target="_blank">流浪ฅ'ω'ฅ</a></div>
<div class="dhh7"><a href="一阶段项目spx.html" style="text-decoration: none;color: #FFF "target="_blank">购物车</a></div>
</div>
<div class="center1">
<div class="center1-1">
<div id="pj-lunbo3">

<div class="pj-Carousel">
<div class="pj-Carousel-box">
<div class="pj-Carousel-item">
<img src="http://localhost:4713/img/lunbo1.jpg" /></div>
<div class="pj-Carousel-item">
<img src="http://localhost:4713/img/lunbo2.jpg" /></div>

<div class="pj-Carousel-item">
<img src="http://localhost:4713/img/lunbo3.jpg" />
</div>
<div class="pj-Carousel-item">
<img src="http://localhost:4713/img/lunbo25.jpg" />
</div>

</div>

<div class="pj-Carousel-active"> </div>
</div>
</div>
</div>
</div>
<div class="centerout">
<div class="c2"><div class="c22">
猫猫商城
</div>
</div>
<div class="c3">
<div class="c31">
<div class="c311"><img src="img/cat1f.png" /></div>
<div class="c312">进口猫粮</div>
<div class="c313">猫罐头/妙鲜包</div>
<div class="c314">幼猫粮成猫粮 </div>
</div>
<div class="c32">
<div class="c321">
<div class="c3211">
<a href="喵星人2222.html" target="_blank"><img src="img/jinkou.jpg" /></a><br />
<a href="遮罩层.html"> 荒野盛宴特选风味烤鹿肉荒野盛宴</a><br />
<label style="color:red;"> ¥ 350.00</label>
</div>
<div class="c3212">
<img src="img/catj1.jpg" /><br />
素力高Solid Gold 无谷物抗敏<br />
<label style="color:red;"> ¥ 440.00</label>
</div>
<div class="c3213">
<img src="img/catj2.jpg" /><br />
牛油果Avoderm 成猫粮鸡<br />
<label style="color:red;"> ¥ 293.00</label>
</div>
<div class="c3214">
<img src="img/catj3.jpg" /><br />
冠能室内成猫配方猫粮3kg<br />
<label style="color:red;"> ¥ 230.00</label>
</div>
</div>
<div class="c322">
<div class="c3221">
<img src="img/niurou.jpg" /><br />
Wanpy happy100牛肉慕斯猫罐头<br />
<label style="color:red;"> ¥ 4.50</label>
</div>
<div class="c3222">
<img src="img/catm2.jpg" /><br />
珍味金枪鱼+鸡肉猫罐头17<br />
<label style="color:red;"> ¥ 43.00</label>
</div>
<div class="c3223">
<img src="img/catm3.jpg" /><br />
伟嘉成猫精选金枪鱼味妙鲜<br />
<label style="color:red;">¥ 3.91</label>
</div>
<div class="c3224">
<img src="img/catm1.jpg" /><br />
伊纳宝猫用金枪鱼、鸡小胸<br />
<label style="color:red;"> ¥ 2.20</label>
</div>
</div>
</div>
<div class="c33">
<div class="c331"><img src="img/catshop2.jpg" /></div>
<div class="c332"><img src="img/catshop1.jpg" /></div>
</div>
</div>
<div class="c4">
<div class="c41">
<div class="c411"><img src="img/2f.png" /></div>
<div class="c412">跳蚤蛔虫</div>
<div class="c413">感冒腹泻/缺钙脱毛</div>
<div class="c414">美毛护肤综合营养 </div>
</div>
<div class="c42">
<div class="c421">
<div class="c4211">
<img src="img/tz1.jpg" /><br />
湃特安琪儿肠虫宁体内驱虫药<br />
<label style="color:red;"> ¥ 28.00</label>
</div>
<div class="c4212">
<img src="img/tz2.jpg" /><br />
福来恩猫用增效灭虱滴剂<br />
<label style="color:red;"> ¥ 42.00</label>
</div>
<div class="c4213">
<img src="img/tz3.jpg" /><br />
小宠EHD 猫蚤清60ml 预防治<br />
<label style="color:red;"> ¥ 36.00</label>
</div>
<div class="c4214">
<img src="img/tz4.jpg" /><br />
魔金猫用天然除跳蚤项圈<br />
<label style="color:red;">¥ 18.20</label>
</div>
</div>
<div class="c422">
<div class="c4221">
<img src="img/gm1.jpg" /><br />
谷登猫用六种菌3g*8包猫<br />
<label style="color:red;"> ¥ 59.00</label>
</div>
<div class="c4222">
<img src="img/gm2.jpg" /><br />
小宠EHD 猫咪专用益生菌5g<br />
<label style="color:red;">¥ 46.00</label>
</div>
<div class="c4223">
<img src="img/qg1.jpg" /><br />
麦德氏inplus 猫用护毛超浓<br />
<label style="color:red;">¥ 85.00</label>
</div>
<div class="c4224">
<img src="img/qg2.jpg" /><br />
英国MAG 猫用超浓缩冰岛三<br />
<label style="color:red;">¥ 168.00</label>
</div>
</div>
</div>
<div class="c43">
<div class="c431"><img src="img/catys1.jpg" /></div>
<div class="c432"><img src="img/catys2.jpg" /></div>
</div>
</div>
<div class="c5">
<div class="c51">
<div class="c511"><img src="img/3f.png" /></div>
<div class="c512">冬季窝笼</div>
<div class="c513">喂食器皿/猫咪玩具</div>
<div class="c514">猫抓板逗猫棒 </div>
</div>
<div class="c52">
<div class="c521">
<div class="c5211">
<img src="img/mw1.jpg" /><br />
怡亲多可特可爱竖耳朵猫窝<br />
<label style="color:red;"> ¥ 55.00</label>
</div>
<div class="c5212">
<img src="img/mw2.jpg" /><br />
田田猫瓦楞纸组合房子独立<br />
<label style="color:red;"> ¥ 66.00</label>
</div>
<div class="c5213">
<img src="img/mw3.jpg" /><br />
怡亲宠物猫笼猫屋三层猫别<br />
<label style="color:red;"> ¥ 469.00</label>
</div>
<div class="c5214">
<img src="img/mw4.jpg" /><br />
田田猫蛋糕造型瓦楞纸猫抓<br />
<label style="color:red;">¥ 26.20</label>
</div>
</div>
<div class="c522">
<div class="c5221">
<img src="img/ws1.jpg" /><br />
田田猫椭圆形卡通猫碗<br />
<label style="color:red;"> ¥ 26.00</label>
</div>
<div class="c5222">
<img src="img/ws2.jpg" /><br />
AFP 猫咪专用活氧饮水机活<br />
<label style="color:red;">¥ 109.00</label>
</div>
<div class="c5223">
<img src="img/wj1.jpg" /><br />
斑卓猫爬架BT-18023 宠物用<br />
<label style="color:red;">¥ 166.00</label>
</div>
<div class="c5224">
<img src="img/wj2.jpg" /><br />
怡亲多可特小型猫爬架TPCF<br />
<label style="color:red;">¥ 79.00</label>
</div>
</div>
</div>
<div class="c53">
<div class="c531"><img src="img/ttm.jpg" /></div>
<div class="c532"><img src="img/ttm2.gif" /></div>
</div>
</div>
<div class="c6">
<div class="c61">
<div class="c611"><img src="img/4f.png" /></div>
<div class="c612">猫砂</div>
<div class="c613">猫砂盆/消毒除臭</div>
<div class="c614">水晶猫砂猫用香水 </div>
</div>
<div class="c62">
<div class="c621">
<div class="c6211">
<img src="img/ms1.jpg" /><br />
埃尔西博士雅乐多膨润土猫砂<br />
<label style="color:red;"> ¥ 258.00</label>
</div>
<div class="c6212">
<img src="img/ms2.jpg" /><br />
怡亲柠檬香型膨润土猫砂5L（<br />
<label style="color:red;"> ¥ 15.00</label>
</div>
<div class="c6213">
<img src="img/ms3.jpg" /><br />
法国娜朵Nullodor 彩色颗粒<br />
<label style="color:red;"> ¥ 88.00</label>
</div>
<div class="c6214">
<img src="img/ms4.jpg" /><br />
美国进口蓝钻抗菌低过敏猫<br />
<label style="color:red;">¥ 198.00</label>
</div>
</div>
<div class="c622">
<div class="c6221">
<img src="img/mp1.jpg" /><br />
怡亲多可特半封闭式经济型<br />
<label style="color:red;"> ¥ 24.00</label>
</div>
<div class="c6222">
<img src="img/mp2.jpg" /><br />
佳乐滋双层猫砂盆套装（半封)<br />
<label style="color:red;">¥ 384.00</label>
</div>
<div class="c6223">
<img src="img/xd1.jpg" /><br />
小宠EHD 猫除臭消毒液400ml <br />
<label style="color:red;">¥ 36.00</label>
</div>
<div class="c6224">
<img src="img/xd2.jpg" /><br />
Neo 猫砂除臭粉100g<br />
<label style="color:red;">¥ 7.00</label>
</div>
</div>
</div>
<div class="c63">
<div class="c631"><img src="img/sh1.jpg" /></div>
<div class="c632"><img src="img/sh2.jpg" /></div>
</div>
</div>

<div class="bottomdhh"><img src="img/1347.121.jpg" /></div>

<div class="biao">
<div class="biao1">
<img src="img/345.143.jpg" /></div>

</div>
<div class="biao2">

<ul>
<li class="li"><h4>支付方式</h4><br /></li>
<li class="li"> 货到付款<br /></li>
<li class="li">余额支付<br /></li>
<li class="li">在线支付<br /></li>

</ul>

</div>
<div class="biao5">
<ul>
<li class="li"><h4>配送方式</h4><br /></li>
<li class="li"> 宠喵快递<br /></li>
<li class="li">外包快递<br /></li>
<li class="li">物流运输<br /></li>
<li class="li">公司地址<br /></li>

</ul>

</div>
<div class="biao6">
<ul>
<li class="li"><h4>购物指南</h4><br /></li>
<li class="li"> 退换货政策<br /></li>
<li class="li">时代杂志<br /></li>
<li class="li">常见问题<br /></li>
<li class="li">宠物知识<br /></li>
</ul>

</div>
<div class="biao7">
<ul>
<li class="li"><h4>关于我们</h4><br /></li>
<li class="li"> 关于我们<br /></li>
<li class="li">仓储中心<br /></li>
<li class="li">联系我们<br /></li>
<li class="li">人才招聘<br /></li>
</ul>

</div>
<div class="biao8">
<ul>
<li class="li"><h4>扫描下载APP</h4><br /></li>
<li class="youhui">下单更优惠<br /></li>
</ul>
<br />
<img src="img/91.89.jpg" style="margin-left:27px;margin-top:-5px;"/>
</div>
<div class="biao9">
<ul>
<li class="li"><h4>扫描关注宠喵</h4><br /></li>
<li class="youhui">商城微信<br /></li>
</ul>
<br />
<img src="img/90.91.jpg" style="margin-left:27px;margin-top:-5px;" />
</div>
<div class="biao3"><img src="img/biao1.jpg.jpg" /></div>
<div class="biao4"><img src="img/biao.888.jpg.jpg" /></div>

</div>

</body>
</html>

<script src="js/jquery-1.8.2.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery.pj.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(function () {

$("#pj-lunbo3").Carousel({
'play': 'true', //是否循环播放
'prevButton': '#prev', //左按钮
'nextButton': '#next', //右按钮
'fade': 'true',
'playTimer': '2000',
'eventClick': 'true'
});

})
</script>

查看全文

相关阅读:
LeetCode 977 有序数组的平方
 LeetCode 24 两两交换链表中的节点
 LeetCode 416 分割等和子集
 LeetCode 142 环形链表II
LeetCode 106 从中序与后序遍历序列构造二叉树
 LeetCode 637 二叉树的层平均值
 LeetCode 117 填充每个节点的下一个右侧节点
 LeetCode 75 颜色分类
 redhat 7.4 挂载ntfs格式的u盘并且使用
 redhat 查看CPU frequency scaling（CPU频率缩放）

原文地址：https://www.cnblogs.com/yujiamin123/p/6952482.html