Popular Posts With Automatic Numbering - Bubbles

Đăng nhập Blogger > Mẫu > chỉnh sửa HTML để thêm tiệc ích bài đăng phổ biến cho Blogger

#Thêm css

Chèn code dưới vào trên thẻ ]]></b:skin>

.popular-posts ul { 
/* popular post ưith auto numbering */
padding-left: 0px; 
counter-reset: popcount; 
}
.popular-posts ul li:before { 
list-style-type: none; 
margin-right: 15px; 
padding: 0.3em 0.6em; 
counter-increment: popcount; 
content: counter(popcount); 
font-size: 16px; 
background: #292D30;   /* màu nền */
color: #ffffff;  /*màu chữ */
position: relative; 
font-weight: bold; 
font-family: georgia; 
float: left; 
border: 2px solid #dddddd; 
box-shadow: 1px 2px 9px #666666; }
.popular-posts ul li { 
border-bottom: 1px dashed #dddddd; 
}
.popular-posts ul li:hover { 
border-bottom: 1px dashed #696969; 
}
.popular-posts ul li a { 
text-decoration:none; color:#5A5F63; 
}

.popular-posts ul li a:hover { 
text-decoration:none; 
}

Thay box-shadow: 1px 2px 9px #666666;
thành border-radius: 15px; nếu muốn bo tròn viền của các con số.

#Nếu nó hoạt động không tốt

Hãy sử dụng code sau khi code trên hoạt động không tốt.

.popular-posts ul { 
padding-left: 0px; 
counter-reset: popcount; 
}
.popular-posts ul dd:before { 
list-style-type: none; 
margin-right: 15px; 
padding: 0.3em 0.6em; 
counter-increment: popcount; 
content: counter(popcount); 
font-size: 16px; 
background: #292D30; 
color: #ffffff; 
position: relative; 
font-weight: bold; 
font-family: georgia; 
float: left; 
border: 2px solid #dddddd; 
box-shadow: 1px 2px 9px #666666; }
.popular-posts ul li { 
border-bottom: 1px dashed #dddddd; 
}
.popular-posts ul dd:hover { 
border-bottom: 1px dashed #696969; 
}
.popular-posts ul dd a { 
text-decoration:none; color:#5A5F63; 
}

.popular-posts ul dd a:hover { 
text-decoration:none; 
}

Nguồn MBT