分享程序员开发的那些事...
更新时间：2022-09-13 20:20:30
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
|
<div class="search w">
<form action="" method="get">
<input name="" type="text" class="search_input" placeholder="请输入您想要查找的爆料">
<!-- .search_input { .search_submit {
width: 85%; float: left;
margin: 0px; width: 20%;
padding-top: 12px; height: 37px;
padding-right: 0px; border-top-width: 0px;
padding-bottom: 10px; border-right-width: 0px;
padding-left: 40px; border-bottom-width: 0px;
float: left; border-left-width: 0px;
border-top-width: 0px; border-top-style: none;
border-right-width: 0px; border-right-style: none;
border-bottom-width: 0px; border-bottom-style: none;
border-left-width: 0px; border-left-style: none;
border-top-style: none; outline: none;
border-right-style: none; font-family: Helvetica, "Microsoft YaHei", Arial, Helvetica, sans-serif;
border-bottom-style: none; font-size: 14px;
border-left-style: none; line-height: 37px;
outline: none; /* 元素周围的一条轮廓线 */ color: #FFFFFF;
font-family: Helvetica, "Microsoft YaHei", Arial, Helvetica, sans-serif; background-color: #009999;
font-size: 13px; }
color: #666666;
background-image: url(../images/iconfont-sousuo.png);
background-repeat: no-repeat;
background-position: 10px center; /*图片水平位置,垂直方向的位置 */
background-size: 20px; /* 图片大小 */
width: 80%;
}-->
<input name="" type="button" class="search_submit" value="搜索">
</form>
</div>
|
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
|
<div class="bl_view_img"><img src="http://baoliao.178hui.com/upload/2015/0710/12332059693.jpg" /></div>
<!-- .bl_view_img { .bl_view_img img {
text-align: center;图片居中 max-height: 150px; 图片缩放
padding: 10px; }
} -->
<div class="bl_view_title">
<!-- .bl_view_title {
padding: 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #F2F2F2;
font-size: 14px;
color: #333333;
line-height: 22px; 行距
} -->
<span class="bl_type">白菜</span>
<!-- .bl_type {
font-size: 10px;
color: #FFFFFF;
padding-top: 2px;
padding-right: 5px;
padding-bottom: 1px;
padding-left: 5px;
border-radius: 5px;
background-color: #ff3030;
margin-right: 2px;
} -->
<span class="bl_type" style="background-color:#53bf1e;">活动</span>
<span class="bl_type" style="background-color:#00bb9c;">优质</span>
韩国现代（HYUNDAI) BD-YS2003 多功能养生壶 煎药壶2.0L
</div>
|
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
|
<div class="bl_view_note">手机端：99元包邮</div>
<!-- .bl_view_note {
font-size: 14px;
color: #FF6600;
padding: 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #F2F2F2;
line-height: 22px;
} -->
<div class="bl_view_tag">
<!-- .bl_view_tag {
font-size: 12px;
line-height: 40px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #F2F2F2;
height: 40px;
padding-right: 1%;
padding-left: 1%;
} -->
<div class="bl_view_price">￥99.00</div>
<!-- .bl_view_price {
font-size: 16px;
color: #FF3300;
float: left;
margin-left: 1%;
} -->
<div class="bl_view_oprice">￥138.00</div>
<!-- .bl_view_oprice {
font-size: 12px;
color: #666666;
text-decoration: line-through;
text-align: right;
float: left;
margin-left: 5%;
} -->
<div class="bl_view_mall">商城：京东商城</div>
<!-- .bl_view_mall {
font-size: 12px;
text-align: center;
float: right;
color: #666666;
margin-right: 1%;
} -->
</div>
<div class="bl_view_tag">
<div class="bl_view_user">爆料者：xye1**</div>
<!-- .bl_view_user {
font-size: 12px;
color: #666666;
text-align: left;
float: left;
margin-left: 1%;
} -->
<div class="bl_view_time">人气：360次浏览</div>
<!-- .bl_view_time {
font-size: 12px;
color: #666666;
text-align: right;
float: right;
margin-right: 1%;
} -->
</div>
<div class="bl_view_tag">
<div class="bl_view_user">喜欢：2人喜欢</div>
<div class="bl_view_time">时间：2015-07-10 12:33:36</div>
</div>
<div class="go_buy"><a href="#">直达链接</a></div>
<!-- .go_buy { .go_buy a {
line-height: 40px; color: #FFFFFF;
height: 40px; background-color: #00bb9c;
text-align: center; text-align: center;
} line-height: 40px;
float: left;
width: 100%;
text-decoration: none;
font-size: 16px;
}
-->
</div>
|
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
|
<div class="bl_view_content w">
<h1>推荐理由<span>优质爆料QQ群①：186666517</span></h1>
<!-- .bl_view_content h1 { .bl_view_content h1 span {
font-size: 16px; float: right;
font-weight: normal; font-size: 12px;
color: #FF6600; color: #999999;
line-height: 45px; margin-right: 5px;
border-bottom-width: 1px; }
border-bottom-style: solid;
border-bottom-color: #F3F3F3;
text-indent: 10px;
margin: 0px;
padding: 0px;
} -->
<div class="bl_view_word">
<!-- .bl_view_word {
padding: 10px;
font-size: 14px;
color: #666666;
line-height: 22px;
overflow: hidden;
} -->
<p>
<!-- .bl_view_word p { .bl_view_word a {
margin-top: 5px; color: #00bb9c;
margin-right: 0px; text-decoration: none;
margin-bottom: 5px; }
margin-left: 0px;
} -->
飞利浦PHILIPS LED球泡5W/E27日光色4连包，<a href="#">京东商城售价109元</a>，可以参加满200-60的活动，例如凑单2套，
折合79元/套，不到20元/个，其它渠道都在39元/个左右。
</p>
<p>
飞利浦PHILIPS LED球泡5W/E27日光色4连包，功率为5W，色温：6500K，家庭装修、商场、展示厅、酒店、办公室等，
可直接替换相同灯座的灯泡。
</p>
<p>
特步男鞋跑步鞋男士运动鞋新款休闲鞋网面透气跑步鞋减震超轻慢跑鞋男 灰黄 42
</p>
<p>
<strong>京东6月17日活动秒杀 10点 61.8元秒杀</strong>
</p>
<p>
<img src="http://baoliao.178hui.com/upload/shaidan/20150617/1434503287905.jpg" _
src="http://baoliao.178hui.com/upload/shaidan/20150617/1434503287905.jpg" />
</p>
<p>
<a href="http://jump.178hui.com/index.php?mod=jump&act=url&url=http%3A%2F%2Fsale.jd.com%2Fact%2FRS4tPQI3DuHor.html&uid=12405"
rel="nofollow" target="_blank">
<img src="http://baoliao.178hui.com/upload/shaidan/20150616/14344169658370.jpg" _
src="http://baoliao.178hui.com/upload/shaidan/20150616/14344169658370.jpg" />
</a>
</p>
</div>
</div>
|
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
|
<div class="bl_comment w">
<h1>猜您还喜欢</h1>
<!-- .bl_comment h1 {
font-size: 14px;
font-weight: normal;
color: #666666;
margin: 0px;
line-height: 40px; h1的高度就确定了
padding-left: 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #F6F6F6;
} -->
<div class="comment_list">
<!-- .comment_list {
padding: 10px;
font-size: 12px;
color: #666666;
} -->
<ul class="ui-list ui-border-tb">
<li>
<div class="ui-list-thumb ui-avatar-s">
<span><img src="http://baoliao.178hui.com/upload/2015/0710/12332059693.jpg" /></span>
</div>
<div class="ui-list-info ui-border-t">
<h4>韩国现代（HYUNDAI) BD-YS2003 多功能养生壶 煎药壶2.0L </h4>
<p>手机端：99元包邮</p>
<p style="color:#FF6600">￥99元</p>
</div>
</li>
<li>
<div class="ui-list-thumb ui-avatar-s">
<span><img src="http://baoliao.178hui.com/upload/2015/0710/12332059693.jpg" /></span> </div>
<div class="ui-list-info ui-border-t">
<h4>韩国现代（HYUNDAI) BD-YS2003 多功能养生壶 煎药壶2.0L </h4>
<p>手机端：99元包邮</p>
<p style="color:#FF6600">￥99元</p>
</div>
</li>
<li>
<div class="ui-list-thumb ui-avatar-s">
<span><img src="http://baoliao.178hui.com/upload/2015/0710/12332059693.jpg" /></span> </div>
<div class="ui-list-info ui-border-t">
<h4>韩国现代（HYUNDAI) BD-YS2003 多功能养生壶 煎药壶2.0L </h4>
<p>手机端：99元包邮</p>
<p style="color:#FF6600">￥99元</p>
</div>
</li>
<li>
<div class="ui-list-thumb ui-avatar-s">
<span><img src="http://baoliao.178hui.com/upload/2015/0710/12332059693.jpg" /></span> </div>
<div class="ui-list-info ui-border-t">
<h4>韩国现代（HYUNDAI) BD-YS2003 多功能养生壶 煎药壶2.0L </h4>
<p>手机端：99元包邮</p>
<p style="color:#FF6600">￥99元</p>
</div>
</li>
<li>
<div class="ui-list-thumb ui-avatar-s">
<span><img src="http://baoliao.178hui.com/upload/2015/0710/12332059693.jpg" /></span> </div>
<div class="ui-list-info ui-border-t">
<h4>韩国现代（HYUNDAI) BD-YS2003 多功能养生壶 煎药壶2.0L </h4>
<p>手机端：99元包邮</p>
<p style="color:#FF6600">￥99元</p>
</div>
</li>
</ul>
</div>
</div>
|
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
|
<div class="pl_icon"></div> <!-- 评这个字 -->
<!-- .pl_icon { background-image: url(../images/iconfont-fzst-ping.png);
background-repeat: no-repeat;
background-size: 40px;
height: 40px;
width: 40px;
position: fixed;
right: 10px;
bottom: 100px;
} -->
<div class="bl_pinlun w">
<form action="" method="get">
<input name="" type="text" placeholder="我来说一句" class="pinlun_input">
<!-- .pinlun_input {
float: left;
width: 75%;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
font-size: 14px;
color: #333333;
font-family:Helvetica, "Microsoft YaHei", Arial, Helvetica, sans-serif;
outline: none;
padding-left: 42px; 输入框里面文字的左边距
padding-right: 10px; 输入框里面文字的右边据
padding-top: 15px; 输入框里面的上边距
padding-bottom: 10px; 输入框里面的下边据
background-image: url(../images/iconfont-pinglun.png); 输入框里面前面的小图标
background-repeat: no-repeat;
background-size: 25px; 小图标的大小
background-position: 10px center; 小图标的x,y位置
} -->
<input name="" type="button" class="pinlun_submit" value="发表评论">
<!-- .pinlun_submit {
line-height: 40px; 里面文字垂直居中
color: #FFFFFF;
height: 40px; 高度
width: 25%; 宽度
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
font-family:Helvetica, "Microsoft YaHei", Arial, Helvetica, sans-serif;
outline: none;
background-color: #7fc242;
} -->
</form>
</div>
<div class="no_login w">您需要登录才能发表牛评哦！<a href="#">马上登录</a><a href="#">免费注册</a></div>
<!-- .no_login { .no_login a { line-height: 45px; div的line-height能够改变div的高度并且文字垂直居中 margin-left: 15px;
text-align: center; div里面的文字水平居中 }
color: #333333;
} -->
<div class="bl_comment w">
<h1>TA们的牛评（10）</h1>
<!-- .bl_comment h1 {
font-size: 14px;
font-weight: normal;
color: #666666;
margin: 0px;
line-height: 40px;
padding-left: 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #F6F6F6;
} -->
<div class="comment_list">
<!-- .comment_list {
padding: 10px;
font-size: 12px;
color: #666666;
} -->
<ul>
<li>
<!-- .comment_list li {
float: left;
border-bottom-width: 1px;
border-bottom-style: dashed;
border-bottom-color: #CCCCCC;
width: 100%;
padding-bottom: 10px;
margin-bottom: 10px;
} -->
<div class="pl_user_img"><img src="http://baoliao.178hui.com/upload/avatar/0000/0015/24_avatar_middle.jpg" /></div>
<!-- .comment_list .pl_user_img { .comment_list .pl_user_img img {
float: left; height: 30px;
height: 30px; width: 30px;
width: 30px; border-radius: 50%;
overflow: hidden; }
border-radius: 50%;
}
-->
<div class="pl_user_top">
<!-- .comment_list .pl_user_top {
float: left;
width: 50%;
line-height: 30px;
max-width: 98%;
} -->
<div class="pl_user_name">xxx198**</div>
<!-- .comment_list .pl_user_name {
float: left;
margin-left: 10px;
color: #0099CC;
font-size: 12px;
} -->
<div class="pl_user_time">6天前</div>
<!-- .comment_list .pl_user_time {
float: left;
margin-left: 10px;
color: #999999;
font-size: 12px;
} -->
</div>
<div class="pl_user_comment">可以一个号多撸，不限次数，大家悠着点，别整黑号了。可以一个号多撸，不限次数，大家悠着点，别整黑号了。</div>
<!-- .comment_list .pl_user_comment {
width: 97%;
margin-top: 5px;
padding-left: 2.2%;
float: left;
text-align: justify;
line-height: 22px;
font-size: 12px;
} -->
</li>
<li>
<div class="pl_user_img"><img src="http://baoliao.178hui.com/upload/avatar/0000/0015/24_avatar_middle.jpg" /></div>
<div class="pl_user_top">
<div class="pl_user_name">xxx198**</div>
<div class="pl_user_time">6天前</div>
</div>
<div class="pl_user_comment">可以一个号多撸，不限次数，大家悠着点，别整黑号了。可以一个号多撸，不限次数，大家悠着点，别整黑号了。</div>
</li>
<li>
<div class="pl_user_img"><img src="http://baoliao.178hui.com/upload/avatar/0000/0015/24_avatar_middle.jpg" /></div>
<div class="pl_user_top">
<div class="pl_user_name">xxx198**</div>
<div class="pl_user_time">6天前</div>
</div>
<div class="pl_user_comment">可以一个号多撸，不限次数，大家悠着点，别整黑号了。</div>
</li>
<li>
<div class="pl_user_img"><img src="http://baoliao.178hui.com/upload/avatar/0000/0015/24_avatar_middle.jpg" /></div>
<div class="pl_user_top">
<div class="pl_user_name">xxx198**</div>
<div class="pl_user_time">6天前</div>
</div>
<div class="pl_user_comment">可以一个号多撸，不限次数，大家悠着点，别整黑号了。可以一个号多撸，不限次数，大家悠着点，别整黑号了。</div>
</li>
|
本文转自农夫山泉别墅博客园博客，原文链接：http://www.cnblogs.com/yaowen/p/5525876.html，如需转载请自行联系原作者