Giới thiệu
Thuộc tính listStyleType trong HTML DOM Style dùng để thiết lập hoặc lấy kiểu dấu mục (marker) của mục danh sách (list-item).
Cú pháp
Thiết lập listStyleType:
object.style.listStyleType = value
Một số giá trị phổ biến
| Giá trị | Mô tả |
|---|---|
| armenian | Số Armenia truyền thống. |
| circle | Dấu tròn rỗng. |
| cjk-ideographic | Số ký tự CJK (Trung/Ngày/Hàn). |
| decimal | Số thập phân (mặc định cho <ol>). |
| decimal-leading-zero | Số thập phân có số 0 đứng trước (01, 02...). |
| disc | Dấu tròn đầy (mặc định cho <ul>). |
| hiragana | Đếm Hiragana truyền thống. |
| katakana | Đếm Katakana truyền thống. |
| lower-alpha | Chữ cái thường (a, b, c...). |
| lower-greek | Ký tự Hy Lạp thường. |
| none | Không hiển thị dấu mục. |
| square | Dấu vuông. |
| upper-alpha | Chữ cái hoa (A, B, C...). |
| initial | Đặt về mặc định. |
| inherit | Kế thừa từ cha. |
Ví dụ
Ví dụ thay đổi list-style-type sang upper-roman (số La Mã hoa).
<!DOCTYPE html> <html> <head> <script>
function changeListType() {
document.getElementById("LIST1").style.listStyleType = "upper-roman";
document.getElementById("Sample").innerHTML = "Kiểu danh sách đã đổi thành số La Mã hoa";
}
</script> </head> <body>
<ul id="LIST1">
<li>LIST ITEM1</li>
<li>LIST ITEM2</li>
<li>LIST ITEM3</li>
<li>LIST ITEM4</li>
</ul>
<p>Nhấn nút để thay đổi kiểu danh sách</p>
<button type="button" onclick="changeListType()">Thay đổi List Type</button>
<p id="Sample"></p>
</body> </html>
Kết quả
Sau khi nhấn nút Thay đổi List Type:
