Danh sách trong HTML: Hướng dẫn về cách sử dụng danh sách để hiển thị dữ liệu

Danh sách là một phần quan trọng trong HTML để hiển thị dữ liệu một cách có tổ chức và dễ đọc. HTML cung cấp ba loại danh sách chính: danh sách không sắp xếp, danh sách có sắp xếp và danh sách định nghĩa.

Danh sách không sắp xếp (<ul>) sử dụng các mục không có thứ tự cụ thể và được hiển thị dưới dạng các dấu đầu dòng, thường là các dấu chấm đen. Đây là một lựa chọn phổ biến để liệt kê các mục mà không yêu cầu thứ tự cụ thể.

Danh sách có sắp xếp (<ol>) sử dụng các mục có thứ tự cụ thể và được hiển thị dưới dạng các con số hoặc các ký tự. Điều này thường được sử dụng để liệt kê các mục theo thứ tự hoặc đánh số.

Danh sách định nghĩa (<dl>) sử dụng cặp cụm từ và mô tả để hiển thị dữ liệu. Mỗi cặp từ và mô tả được bao gồm trong thẻ <dt> (danh từ định nghĩa) và <dd> (mô tả định nghĩa). Đây là một cách hiệu quả để hiển thị các thuộc tính hoặc định nghĩa cho các khái niệm cụ thể.

 

Danh sách không có thứ tự (<ul>)

- Phần tử <ul> được sử dụng để tạo danh sách không có thứ tự.

- Mỗi mục trong danh sách không có thứ tự được đặt trong một phần tử <li>.

- Danh sách không có thứ tự thường được hiển thị với các dấu chấm hoặc các ký tự tương tự.

<ul>
  <li>Mục 1</li>
  <li>Mục 2</li>
  <li>Mục 3</li>
</ul>

 

Danh sách có thứ tự (<ol>)

- Phần tử <ol> được sử dụng để tạo danh sách có thứ tự.

- Mỗi mục trong danh sách có thứ tự được đặt trong một phần tử <li>.

- Danh sách có thứ tự thường được hiển thị với các số hoặc chữ cái.

<ol>
  <li>Mục 1</li>
  <li>Mục 2</li>
  <li>Mục 3</li>
</ol>

 

Danh sách mô tả (<dl>)

- Phần tử <dl> được sử dụng để tạo danh sách mô tả.

- Mỗi mục trong danh sách mô tả bao gồm một cặp thẻ <dt> (định nghĩa) và <dd> (mô tả).

- Thẻ <dt> chứa từ khóa hoặc thuộc tính cần định nghĩa, trong khi thẻ <dd> chứa mô tả hoặc giải thích cho từ khóa hoặc thuộc tính đó

<dl>
  <dt>Từ khóa 1</dt>
  <dd>Mô tả cho từ khóa 1</dd>
  <dt>Từ khóa 2</dt>
  <dd>Mô tả cho từ khóa 2</dd>
</dl>

 

Thuộc tính type của danh sách (<ul><ol>)

- Thuộc tính type được sử dụng để xác định kiểu đánh số của danh sách có thứ tự.

- Giá trị của type có thể là "1" (số), "A" (chữ cái hoa), "a" (chữ cái thường), "I" (số La Mã hoa) hoặc "i" (số La Mã thường).

<ol type="A">
  <li>Mục 1</li>
  <li>Mục 2</li>
  <li>Mục 3</li>
</ol>

 

Thuộc tính start của danh sách có thứ tự (<ol>)

- Thuộc tính start được sử dụng để xác định giá trị bắt đầu của đánh số trong danh sách có thứ tự.

- Giá trị của start là một số nguyên dương.

<ol start="5">
  <li>Mục 5</li>
  <li>Mục 6</li>
  <li>Mục 7</li>
</ol>

 

Thuộc tính reversed của danh sách có thứ tự (<ol>)

- Thuộc tính reversed được sử dụng để hiển thị danh sách có thứ tự theo thứ tự ngược lại.

- Khi thuộc tính reversed được áp dụng, các số đánh dấu sẽ giảm dần.

<ol reversed>
  <li>Mục 3</li>
  <li>Mục 2</li>
  <li>Mục 1</li>
</ol>

 

Các thuộc tính và phần tử trên cho phép bạn tạo và tùy chỉnh danh sách trong HTML theo nhu cầu của bạn. Bạn có thể sử dụng chúng để hiển thị dữ liệu một cách rõ ràng và có tổ chức trên trang web của bạn.