Tự học html: List

Tự học html: List

Rate this post

Có rất nhiều trường hợp khi chúng ta cần sử dụng list. HTML cung cấp cho chúng ta  ba loại khác nhau:

  • List có thứ tự là list trong đó mỗi mục trong list đánh số. Ví dụ: list có thể là một tập hợp các bước cho một công thức phải được thực hiện theo thứ tự, hoặc một hợp đồng pháp lý
  • trong đó mỗi điểm cần được xác định bởi một phần con số.
  • List không có thứ tự là list bắt đầu bằng dấu đầu dòng (chứ không phải các ký tự chỉ ra thứ tự).
  • List định nghĩa được tạo thành từ một tập hợp các thuật ngữ cùng với định nghĩa cho từng thuật ngữ đó

Các bài viết liên quan:

List có thứ tự

<ol> list có thứ tự được tạo bằng phần tử <ol>.

<li> Mỗi mục trong list được đặt giữa thẻ <li> mở và một thẻ đóng </li>. (Cái li là viết tắt của mục list.)

Trình duyệt thụt lề list theo mặc định.

Đôi khi bạn có thể thấy một loại thuộc tính được sử dụng với <ol> phần tử để chỉ định loại

đánh số (số, chữ cái, số la mã, v.v.). Nó tốt hơn là sử dụng thuộc tính kiểu list style CSS.

<ol>
  <li>items1</li>
  <li>items2</li>
  <li>items3</li>
  <li>items4</li>
</ol>

List không có thứ tự

<ul> list không có thứ tự được tạo với phần tử <ul>.

<li> Mỗi mục trong list được đặt giữa thẻ <li> mở và một thẻ đóng </li>. (Cái li là viết tắt của mục list.)

Trình duyệt thụt lề list theo mặc định.

Đôi khi bạn có thể thấy một loại được sử dụng với thuộc tính <ul> phần tử để chỉ định loại dấu đầu dòng (hình tròn, hình vuông, kim cương và như vậy). Tốt hơn là để sử dụng thuộc tính kiểu list CSS.

<ul>
  <li>items1</li>
  <li>items2</li>
  <li>items3</li>
  <li>items4</li>
</ul>

List định nghĩa

<dl>list định nghĩa được tạo bằng phần tử <dl> và thường là bao gồm một loạt các điều khoản và định nghĩa của họ. Bên trong phần tử <dl>, bạn sẽ thường thấy các cặp <dt> và phần tử <dd>.

<dt> Điều này được sử dụng để chứa thuật ngữ đang được định nghĩa (định nghĩa thuật ngữ).

<dd> Cái này được sử dụng để chứa Định nghĩa. Đôi khi bạn có thể thấy một list nơi có hai thuật ngữ được sử dụng cho cùng một hoặc hai định nghĩa các định nghĩa khác nhau cho cùng một thuật ngữ.

Bạn có thể đặt một list thứ hai bên trong một phần tử <li> để tạo list con hoặc list lồng nhau.

<dl>
  <dt>item1</dt>
  <dd>define item1</dd>
  <dt>item2</dt>
  <dd>define item2</dd>
</dl>

Trình duyệt hiển thị list lồng nhau thụt vào sâu hơn phần gốc list. Trong list không có thứ tự lồng nhau, trình duyệt thường sẽ thay đổi cả kiểu của gạch đầu dòng.

List con

Bạn có thể đặt một danh sách thứ hai bên trong một phần tử để tạo danh sách con hoặc danh sách lồng nhau.

Trình duyệt hiển thị danh sách lồng nhau thụt vào sâu hơn phần gốc danh sách. Trong danh sách không có thứ tự lồng nhau, trình duyệt thường sẽ thay đổi cả kiểu của gạch đầu dòng.

<ol>
  <li>item1
    <ol>
      	<li>Sub_item1</li>
 	 	<li>Sub_item2</li>
  		<li>Sub_item3</li>
  		<li>Sub_item4</li>
    </ol>
  </li>
  <li>item2</li>
  <li>item3</li>
  <li>item4</li>
  <li>item5</li>
</ol>

Leave a Reply