Khi viết blog , đánh số thứ tự (ol) và danh sách Bullet (ul) là một phần quan trọng để giúp cho bài viết tốt hơn, trình tự hơn. Để thay đổi giao diện của số thứ tự và danh sách này, chúng ta sẽ sử dụng CSS để thay đổi màu số thứ tự và danh sách khi rê chuột đến. Thủ thuật này gồm hai phần
- Làm thế nào để thay đổi giao diện của danh sách bullet (ul)
- Làm thế nào để thay đổi giao diện của số thứ tự (ol)
- Vào blogger > Chỉnh Sửa HTMLL
- Chèn code bên dưới vào trước thẻ ]]></b:skin>
.post ul {list-style-type: circle;Bạn có thể thay đổi màu cho phù hợp với sở thích và blog của mình
}
.post ul li {
line-height: 1.5em;
color:#289728;
}
.post ul li:hover {
color:#0080ff;
list-style-type: disc;
}
.post ul p { color:#555555;
line-height:1.4em; }
- Lưu lại
Khi post bài các bạn chỉ cần sử dụng chức năng trên thanh công cụ hoặc soạn thảo theo cú pháp bên dưới
<ul>Trong trường hợp không thành công bạn thử chèn <p> vào sau <li> và </p> vào trước </li>
<li>Dòng 1</li>
<li>Dòng 2</li>
</ul>
<ul>Làm thế nào để thay đổi giao diện của số thứ tự (ol)
<li><p>Dòng 1</p></li>
<li><p>Dòng 2</p></li>
</ul>
Tương tự dán code sau vào trước thẻ ]]></b:skin>
.post ol {Thay đổi màu cho phù hợp
font: italic 1em Georgia, Times, serif;
color: #999999;
}
.post ol li {
line-height: 1.4em;
font: italic 1em Georgia, Times, serif;
color: #289728;
}
.post ol li:hover {
font:bold italic 1em Georgia, Times, serif;
color: #0080ff;
}
.post ol p {
font: normal 1em Arial, Helvetica, sans-serif;
color: #555555;
line-height:1.4em;
}
- Lưu lại
Chúc bạn thành công!
1 comments :
Cảm ơn bạn đã ghé thăm Troll VL !
Insert Emoticons» Tạm thời ngăn không cho comment với chế độ ẩn danh vì có một số bạn không có thành ý cố tình spam. Mong các bạn thông cảm!
» Bạn nên viết bằng Tiếng Việt có dấu để mọi người dễ đọc, dễ bình luận
» Để liên hệ,góp ý và đóng góp bài viết bạn click vào đây
Sử dụng các thẻ sau cho comments
» Chèn nội dung vào blockquote <b rel="quote">Nội dung blockquote</b>
» Chèn nội dung vào note <em rel="note">Nội dung note</em>
» Chèn code vào khung pre <i rel="pre">Nội dung code</i>
» Chèn hình ảnh <i rel="image">Link hình ảnh</i>
» Chèn video từ youtube [youtube]link video[/youtube]
» Chèn link <i rel="anchor">Link</i>
Mã Hóa Code Tạo và xem trước comments Cancel Reply
&
Convert
'
Convert
"
Convert
<
Convert
>