Kiến thức về HTML (P15): Các thẻ danh sách có thứ tự và không có thứ tự

Để thiết kế web tốt hơn, chúng ta sẽ tìm hiểu thẻ danh sách có thứ tự và không có thứ tự trong bài hôm nay nhé.

Danh sách có thứ tự

Để thể hiện danh sách có thứ tự ta sử dụng cặp thẻ: <ol></ol> và <li></li>, trong đó:

  • <ol></ol> là viết tắt của chữ “ordered list” có nghĩa là danh sách có thứ tự.
  • <li></li> viết tắt của chữ “list item” có nghĩa là mục của danh sách.

Danh sách sau đây gọi là danh sách có thứ tự:

1s

HTML viết

2S

Hiển thị trình duyệt:

3S

 

Danh sách không có thứ tự

Để thể hiện danh sách không có thứ tự ta sử dụng cặp thẻ: <ul></ul> và <li></li>, trong đó:

  • <ul></ul> là viết tắt của chữ: unordered list có nghĩa là danh sách không có thứ tự
  • <li></li> viết tắt của chữ: list item có nghĩa là mục của danh sách.

Danh sách sau đây gọi là danh sách không có thứ tự:

1R

HTML viết

2R

Hiển thị trình duyệt:

3R

Cấu trúc thẻ danh sách có thứ tự và không có thứ tự

Cấu trúc thể hiện thẻ danh sách có thứ tự và không có thứ tự là tương tự nhau.

Cấu trúc phải theo các nguyên tắc sau đây:

  • Lúc nào cũng phải tồn tại 1 cặp thẻ, không thể thiếu một trong 2:
    • Đối với danh sách có thứ tự, phải tồn tại cặp thẻ: <ol></ol>, <li></li>.
    • Đối với danh sách không có thứ tự, phải tồn tại cặp thẻ: <ul></ul>, <li></li>.
  • Bên trong thẻ <ol></ol> (hoặc <ul></ul>) chỉ chứa trực tiếp một thẻ duy nhất <li></li>.
  • Bên trong thẻ <li></li> chứa được hầu hết các thẻ HTML/XHTML, tuy nhiên không được chứa một số thẻ sau đây: <html></html>, <meta></meta>, <body></body>, <title></title>, <link></link>. Và một số thẻ không nên chứa như: <style></style>, <script></script>.

5R

  • Bên trong thẻ <ol></ol> (hoặc <ul></ul>) chỉ chứa trực tiếp thẻ <li></li>, không được xen kẻ bất kỳ thẻ nào khác, những cấu trúc như bên dưới đây là sai, không đúng chuẩn W3C:

6R

Một số cấu trúc của danh sách có thứ tự và không có thứ tự

  • Người viết đánh giá

  • Rated 5 stars
  • 100%

  • Reviewed by:
  • Published on:
  • Last modified: 01/07/2016

Giới thiệu

WEBICO là công ty thiết kế website theo hướng chuyên nghiệp và hiện đại, tiên phong trong việc áp dụng các công nghệ hàng đầu trên thế giới hiện nay như HTLM5, CS3, PHP, Bootstrap,...Ngoài ra, WEBICO còn cung cấp thêm các giải pháp cũng như dịch vụ chuyên về Internet Marketing.

Báo giá dịch vụ

Liên hệ với chúng tôi để nhận báo giá dịch vụ cho dự án của bạn với chi phí tốt nhất.