master

分支 (1)

管理

管理

master

imitate-tmall
/
classify2.html

<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<script src="js/jquery/2.0.0/jquery.min.js"></script>
<link href="css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet">
<script src="js/bootstrap/3.3.6/bootstrap.min.js"></script>
</head>

<style>
body{
  font-size:12px;
  font-family:Arila;
}
div.categoryPageDiv{
  max-width:1013px;
  margin:10px auto;
}

div.categoryProduct{

  width:225px;
  height:318px;
  border:1px solid #e2e2e3;
  margin:15px 8px 0px 8px;
  float:left;
}
div.categoryProduct:hover{
  border:2px solid #C40000;
}
div.categoryProduct img.productImg{
  width:100%;
  height:180px;
}
div.categoryProduct div.productPrice{
  color:#C40000;
  font-size:21px;
  font-weight:bold;
  margin-left:5px;
  margin-bottom:3px;
}
div.categoryProduct a.productName{
  color:#333333;
}
div.categoryProduct a.productName:hover{
  text-decoration:none;
  color:#C40000;
}
div.categoryProduct div.tmallLink{

  margin:10px 0px;
  text-decoration:underline;
}
div.categoryProduct div.tmallLink a{
  color:#999999;
}
div.categoryProduct div.tmallLink a:hover{
  color:#C40000;
}
div.categoryProduct div.productInfo{
  border-top:1px solid #e2e2e3;
  color:#999999;

}
div.categoryProduct div.productInfo span.monthDealNumber{
  font-weight:bold;
  color:#B57C5B;
}
div.categoryProduct div.productInfo span.productComment{
  border-left:1px solid #EEEEEE;
  border-right:1px solid #EEEEEE;
}
div.categoryProduct div.productInfo span.productComment span.productCommentNumber{
  color:#3388BB;
  font-weight:bold;
 }
 div.categoryProduct span.monthDeal,div.categoryProduct span.productComment{
  display:inline-block;
  width:90px;
  height:29px;
  padding-top:5px;
  padding-bottom:5px;
 }
 div.categoryProduct span.monthDeal,div.categoryProduct span.wangwang{
  padding-left:3px;
 }
</style>

<div class="categoryPageDiv">
  <div class="categoryProducts">

    <div class="categoryProduct" price="799.2">
	  <a href="#nowhere">
	  <img width="100px" src="https://how2j.cn/tmall/img/productSingle_middle/7058.jpg" class="productImg">
	  </a>
	  <div class="productPrice">￥799.20</div>
	  <div ><a href="#nowhere" class="productName">MAXFEEL休闲男士手包真皮手拿包大容量信封包手抓包夹包软韩版潮</a></div>
	  <div class="tmallLink"><a href="#nowhere">天猫专卖</a></div>
	  <div class="productInfo">
	    <span class="monthDeal">月成交<span class="monthDealNumber">16笔</span></span>
		<span class="productComment">评价<span class="productCommentNumber">14</span></span>
		<span class="wangwang"><a href="#nowhere"><img src="https://how2j.cn/tmall/img/site/wangwang.png"></img></a></span>
	  </div>
	</div>

	<div class="categoryProduct" price="511.2">
	  <a href="nowhere">
	  <img width="100px" src="https://how2j.cn/tmall/img/productSingle_middle/7047.jpg" class="productImg">
	  </a>
	  <div class="productPrice">￥511.20</div>
	  <div ><a href="#nowhere" class="productName">宾度 男士手包真皮大容量手拿包牛皮个性潮男包手抓包软皮信封包</a></div>
	  <div class="tmallLink"><a href="#nowhere">天猫专卖</a></div>
	  <div class="productInfo">
	    <span class="monthDeal">月成交<span class="monthDealNumber">49笔</span></span>
		<span class="productComment">评价<span class="productCommentNumber">18</span></span>
		<span class="wangwang"><a href="#nowhere"><img src="https://how2j.cn/tmall/img/site/wangwang.png"></img></a></span>
	  </div>
	</div>

	<div class="categoryProduct" price="488.2">
	  <a href="nowhere">
	  <img width="100px" src="https://how2j.cn/tmall/img/productSingle_middle/7036.jpg" class="productImg">
	  </a>
	  <div class="productPrice">￥488.20</div>
	  <div ><a href="#nowhere" class="productName">唯美诺新款男士手包男包真皮大容量小羊皮手拿包信封包软皮夹包潮</a></div>
	  <div class="tmallLink"><a href="#nowhere">天猫专卖</a></div>
	  <div class="productInfo">
	    <span class="monthDeal">月成交<span class="monthDealNumber">34笔</span></span>
		<span class="productComment">评价<span class="productCommentNumber">16</span></span>
		<span class="wangwang"><a href="#nowhere"><img src="https://how2j.cn/tmall/img/site/wangwang.png"></img></a></span>
	  </div>
	</div>

	<div class="categoryProduct" price="157.25">
	  <a href="nowhere">
	  <img width="100px" src="https://how2j.cn/tmall/img/productSingle_middle/7014.jpg" class="productImg">
	  </a>
	  <div class="productPrice">￥157.25</div>
	  <div ><a href="#nowhere" class="productName">劳迪莱斯男士手包休闲手拿包牛皮大容量钱包男包软面小包包手抓包</a></div>
	  <div class="tmallLink"><a href="#nowhere">天猫专卖</a></div>
	  <div class="productInfo">
	    <span class="monthDeal">月成交<span class="monthDealNumber">17笔</span></span>
		<span class="productComment">评价<span class="productCommentNumber">16</span></span>
		<span class="wangwang"><a href="#nowhere"><img src="https://how2j.cn/tmall/img/site/wangwang.png"></img></a></span>
	  </div>
	</div>


	<div class="categoryProduct" price="411.6">
	  <a href="nowhere">
	  <img width="100px" src="https://how2j.cn/tmall/img/productSingle_middle/7025.jpg" class="productImg">
	  </a>
	  <div class="productPrice">￥411.60</div>
	  <div >
	  <a href="#nowhere" class="productName">英伦邦纹男士手包牛皮大容量真皮手拿包手抓包双拉链商务正品软皮</a>
	  </div>
	  <div class="tmallLink"><a href="#nowhere">天猫专卖</a></div>
	  <div class="productInfo">
	    <span class="monthDeal">月成交<span class="monthDealNumber">25笔</span></span>
		<span class="productComment">评价<span class="productCommentNumber">19</span></span>
		<span class="wangwang"><a href="#nowhere"><img src="https://how2j.cn/tmall/img/site/wangwang.png"></img></a></span>
	  </div>
	</div>

	<div class="categoryProduct" price="268.2">
	  <a href="nowhere">
	  <img width="100px" src="https://how2j.cn/tmall/img/productSingle_middle/7003.jpg" class="productImg">
	  </a>
	  <div class="productPrice">￥268.20</div>
	  <div >
	  <a href="#nowhere" class="productName">帕朗尼男士手拿包真皮手包商务休闲头层牛皮软牛皮大容量休闲钱包</a>
	  </div>
	  <div class="tmallLink"><a href="#nowhere">天猫专卖</a></div>
	  <div class="productInfo">
	    <span class="monthDeal">月成交<span class="monthDealNumber">5笔</span></span>
		<span class="productComment">评价<span class="productCommentNumber">19</span></span>
		<span class="wangwang"><a href="#nowhere"><img src="https://how2j.cn/tmall/img/site/wangwang.png"></img></a></span>
	  </div>
	</div>

	<div class="categoryProduct" price="233.4">
	  <a href="nowhere">
	  <img width="100px" src="https://how2j.cn/tmall/img/productSingle_middle/6992.jpg" class="productImg">
	  </a>
	  <div class="productPrice">￥233.40</div>
	  <div >
	  <a href="#nowhere" class="productName">编织手包手拿包男信封大容量手抓包真皮韩版潮商务休闲牛皮男包</a>
	  </div>
	  <div class="tmallLink"><a href="#nowhere">天猫专卖</a></div>
	  <div class="productInfo">
	    <span class="monthDeal">月成交<span class="monthDealNumber">8笔</span></span>
		<span class="productComment">评价<span class="productCommentNumber">19</span></span>
		<span class="wangwang"><a href="#nowhere"><img src="https://how2j.cn/tmall/img/site/wangwang.png"></img></a></span>
	  </div>
	</div>

	<div class="categoryProduct" price="952">
	  <a href="nowhere">
	  <img width="100px" src="https://how2j.cn/tmall/img/productSingle_middle/6981.jpg" class="productImg">
	  </a>
	  <div class="productPrice">￥952.00</div>
	  <div >
	  <a href="#nowhere" class="productName">犟牛男士手包真皮手拿包头层牛皮商务大容量手抓包软皮夹包信封包</a>
	  </div>
	  <div class="tmallLink"><a href="#nowhere">天猫专卖</a></div>
	  <div class="productInfo">
	    <span class="monthDeal">月成交<span class="monthDealNumber">20笔</span></span>
		<span class="productComment">评价<span class="productCommentNumber">16</span></span>
		<span class="wangwang"><a href="#nowhere"><img src="https://how2j.cn/tmall/img/site/wangwang.png"></img></a></span>
	  </div>
	</div>

	<div style="clear:both"></div>
	</div>
</div>