Thủ thuật cho bài viết : Thay đổi các kí tự đầu dòng của danh sác bằng hình ảnh

List icon

[FD's BlOg] - Bài viết trước mình có giới thiệu thủ thuật thay thế các kí tự dầu dòng của danh sách bằng các kí tự khác (xem ở đây), bài viết này mình sẽ hướng dẫn thay đổi các kí tự này thành hình ảnh.

Xim hình minh họa:

trước khi thực hiện thủ thuật

sau khi thực hịên thủ thuật

Dưới đây là 10 hình, bạn có thể tham khảo:


Hoặc có thể download gói hình ảnh của 10 hình trên : FD-icon-list.rar

☼ Bây giờ ta bắt đầu thực hiện:
1.Đăng nhập blog
2. Vào Bố cục » Chỉnh sửa code HTML » tìm đọan code bên dưới, và thêm vào các dòng code màu đỏ:

}
.post li {
line-height:1.5em;
list-style:none;
background:url("link ảnh") no-repeat left;
vertical-align:top;
padding-top: 0;
padding-$endSide: 0;
padding-bottom: .6em;
padding-$startSide: 17px;
margin:0;
padding-left: 20px;
}

- Ta chỉ quan tâm tới việc thêm 2 dòng code màu đỏ thôi, còn đọan code của bạn có giống như mình code mình đưa hay không thì không quan trọng, do mỗi template có code khác nhau.
- Có thể có những blog có sẵn dòng background:url("link ảnh") no-repeat left;, khi đó bạn chỉ cần thay đổi link ảnh là ok.

3. Save template .

Chúc các bạn thành công.