HTML <li> Thẻ
Thí dụ
Một danh sách HTML có thứ tự (<ol>) và một danh sách HTML không có thứ tự (<ul>):
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Thêm các ví dụ "Hãy tự mình thử" bên dưới.
Định nghĩa và Cách sử dụng
Thẻ <li>xác định một mục danh sách.
Thẻ <li>được sử dụng bên trong danh sách có thứ tự ( <ol> ), danh sách không có thứ tự ( <ul> ) và trong danh sách menu ( <menu> ).
Trong <ul> và <menu>, các mục danh sách thường sẽ được hiển thị bằng các dấu đầu dòng.
Trong <ol>, các mục danh sách thường sẽ được hiển thị bằng số hoặc chữ cái.
Mẹo: Sử dụng CSS để tạo kiểu cho danh sách .
Hỗ trợ trình duyệt
| Element | |||||
|---|---|---|---|---|---|
| <li> | Yes | Yes | Yes | Yes | Yes |
Thuộc tính
| Attribute | Value | Description |
|---|---|---|
| value | number | Only for <ol> lists. Specifies the start value of a list item. The following list items will increment from that number |
Thuộc tính toàn cầu
Thẻ <li>cũng hỗ trợ Thuộc tính chung trong HTML .
Thuộc tính sự kiện
Thẻ <li>cũng hỗ trợ Thuộc tính sự kiện trong HTML .
Các ví dụ khác
Thí dụ
Sử dụng thuộc tính giá trị trong danh sách có thứ tự:
<ol>
<li value="100">Coffee</li>
<li>Tea</li>
<li>Milk</li>
<li>Water</li>
<li>Juice</li>
<li>Beer</li>
</ol>
Thí dụ
Đặt các loại kiểu danh sách khác nhau (với CSS):
<ol>
<li>Coffee</li>
<li
style="list-style-type:lower-alpha">Tea</li>
<li>Milk</li>
</ol>
<ul>
<li>Coffee</li>
<li
style="list-style-type:square">Tea</li>
<li>Milk</li>
</ul>
Thí dụ
Tạo danh sách bên trong danh sách (danh sách lồng nhau):
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
Thí dụ
Tạo một danh sách lồng nhau phức tạp hơn:
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea
<ul>
<li>China</li>
<li>Africa</li>
</ul>
</li>
</ul>
</li>
<li>Milk</li>
</ul>
Các trang liên quan
Hướng dẫn HTML: Danh sách HTML
Tham chiếu DOM HTML: Đối tượng Li
Hướng dẫn CSS: Danh sách tạo kiểu
Cài đặt CSS mặc định
Hầu hết các trình duyệt sẽ hiển thị <li>phần tử với các giá trị mặc định sau:
li {
display: list-item;
}