Trong HTML có 3 loại phần tử danh sách:
- Danh sách không thứ tự (phổ biến nhất)
- Danh sách có thứ tự
- Danh sách mô tả
Danh sách không thứ tự
Danh sách không thứ tự dùng <ul> và mỗi mục dùng <li>:
<ul> <li>Táo</li> <li>Chuối</li> <li>Cam</li> </ul>
Kết quả:
- Táo
- Chuối
- Cam
Mặc định, danh sách không thứ tự có dấu chấm tròn, có thể tùy chỉnh CSS.
Danh sách có thứ tự
Danh sách có thứ tự dùng <ol> và mỗi mục <li>:
<ol> <li>Táo</li> <li>Chuối</li> <li>Cam</li> </ol>
Kết quả:
- Táo
- Chuối
- Cam
Mặc định, hiển thị số thứ tự, có thể tùy chỉnh CSS.
Danh sách mô tả
Danh sách mô tả hoạt động khác hẳn so với hai loại trên.
Cách hoạt động:
<dl>định nghĩa danh sách mô tả (phần tử cha).<dt>định nghĩa thuật ngữ (tên) trong danh sách mô tả (con của<dl>).<dd>cung cấp mô tả, định nghĩa, hoặc giá trị cho thuật ngữ<dt>ngay trước (cũng con của<dl>).
Ví dụ:
<dl> <dt>Voi châu Phi</dt> <dd>Động vật sống trên cạn lớn nhất thế giới.</dd> <dt>Hươu cao cổ</dt> <dd>Động vật cao nhất Trái Đất.</dd> <dt>Cá voi xanh</dt> <dd>Động vật lớn nhất từ trước tới nay (theo chúng ta biết).</dd> </dl>
Kết quả:
- Voi châu Phi
- Động vật sống trên cạn lớn nhất thế giới.
- Hươu cao cổ
- Động vật cao nhất Trái Đất.
- Cá voi xanh
- Động vật lớn nhất từ trước tới nay (theo chúng ta biết).
Danh sách mô tả hiếm dùng trong HTML hiện đại. Trường hợp thường thấy là tạo từ điển thuật ngữ hoặc hiển thị metadata — tuy nhiên có nhiều cách khác làm điều đó trong HTML.