码迷,mamicode.com
首页 > 其他好文 > 详细

今日闪价实例

时间:2016-12-02 22:07:31      阅读:215      评论:0      收藏:0      [点我收藏+]

标签:doctype   ack   splay   margin   ini   osi   list   position   实例   

技术分享
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5 <title>无标题文档</title>
 6 <style type="text/css">
 7 body,ul,li,img,p,span,div{margin:0px;padding:0px;}
 8 body{font-size:12px;color:#444;}
 9 ul,li{list-style:none;}
10 .shopping{width:800px;margin:50px auto;}
11 .shopping .title{height:30px;line-height:30px;color:#FF6600;font-size:18px;font-weight:bold;border-bottom:2px solid #ff6600;}
12 .shopping .content{padding:22px 6px 0px;}
13 .shopping .content li{
14     float:left;
15     width:150px;
16     margin:0px 22px 22px 22px;
17     position:relative;/*相对定位*/
18 }
19 .shopping .content li p{padding:2px 0px;}
20 .shopping .content li .p1{color:#ff6600;}
21 .shopping .content li .span1{color:#990000;font-weight:bold;}
22 .shopping .content li .span2{color:#999;text-decoration:line-through;font-size:10px;padding-left:30px;}
23 .shopping .content div img{position:absolute;top:-15px;right:-15px;}
24 .clear{clear:both;}
25 </style>
26 </head>
27 
28 <body>
29 <div class="shopping">
30     <div class="title">今日闪价</div>
31     <div class="content">
32         <ul>
33             <li>
34                 <a href="#"><img src="images/01.jpg" /></a>
35                 <p>[特价款]雷朋板材光学镜架</p>
36                 <p class="p1">年终盛典 满128减30元</p>
37                 <p><span class="span1">&yen;476.00</span><span class="span2">&yen;1360</span></p>
38                 <div><img src="images/xsq.png" /></div>
39             </li>
40             <li>
41                 <img src="images/02.jpg" />
42                 <p>[特价款]雷朋板材光学镜架</p>
43                 <p class="p1">年终盛典 满128减30元</p>
44                 <p><span class="span1">&yen;476.00</span><span class="span2">&yen;1360</span></p>
45                 <div><img src="images/xsq.png" /></div>
46             </li>
47             <li>
48                 <img src="images/03.jpg" />
49                 <p>[特价款]雷朋板材光学镜架</p>
50                 <p class="p1">年终盛典 满128减30元</p>
51                 <p><span class="span1">&yen;476.00</span><span class="span2">&yen;1360</span></p>
52                 <div><img src="images/xsq.png" /></div>
53             </li>
54             <li>
55                 <img src="images/04.jpg" />
56                 <p>[特价款]雷朋板材光学镜架</p>
57                 <p class="p1">年终盛典 满128减30元</p>
58                 <p><span class="span1">&yen;476.00</span><span class="span2">&yen;1360</span></p>
59                 <div><img src="images/xsq.png" /></div>
60             </li>
61             <li>
62                 <img src="images/05.jpg" />
63                 <p>[特价款]雷朋板材光学镜架</p>
64                 <p class="p1">年终盛典 满128减30元</p>
65                 <p><span class="span1">&yen;476.00</span><span class="span2">&yen;1360</span></p>
66                 <div><img src="images/xsq.png" /></div>
67             </li>
68             <li>
69                 <img src="images/06.jpg" />
70                 <p>[特价款]雷朋板材光学镜架</p>
71                 <p class="p1">年终盛典 满128减30元</p>
72                 <p><span class="span1">&yen;476.00</span><span class="span2">&yen;1360</span></p>
73                 <div><img src="images/xsq.png" /></div>
74             </li>
75             <li>
76                 <img src="images/07.jpg" />
77                 <p>[特价款]雷朋板材光学镜架</p>
78                 <p class="p1">年终盛典 满128减30元</p>
79                 <p><span class="span1">&yen;476.00</span><span class="span2">&yen;1360</span></p>
80                 <div><img src="images/xsq.png" /></div>
81             </li>
82             <li>
83                 <img src="images/08.jpg" />
84                 <p>[特价款]雷朋板材光学镜架</p>
85                 <p class="p1">年终盛典 满128减30元</p>
86                 <p><span class="span1">&yen;476.00</span><span class="span2">&yen;1360</span></p>
87                 <div><img src="images/xsq.png" /></div>
88             </li>
89         </ul>
90         <div class="clear"></div>
91     </div>
92 </div>
93 </body>
94 </html>
代码在这

技术分享

今日闪价实例

标签:doctype   ack   splay   margin   ini   osi   list   position   实例   

原文地址:http://www.cnblogs.com/ChenGuoW/p/6127299.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!