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.