Hướng dẫn 3 types of list in html - 3 loại danh sách trong html


Danh sách HTML cho phép các nhà phát triển web nhóm một bộ các mục liên quan trong danh sách.


Thí dụ

Danh sách HTML chưa được đặt hàng:

  • Mục
  • Mục
  • Mục
  • Mục

Danh sách HTML được đặt hàng:

  1. Mục đầu tiên
  2. Mục thứ hai
  3. Mục thứ ba
  4. Mục thứ tư

Hãy tự mình thử »


Danh sách HTML chưa được đặt hàng

Một danh sách không có thứ tự bắt đầu với thẻ

<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
1. Mỗi mục danh sách bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
2.

Các mục danh sách sẽ được đánh dấu bằng đạn (vòng tròn nhỏ màu đen) theo mặc định:


Đặt hàng danh sách HTML

Một danh sách được đặt hàng bắt đầu với thẻ

<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
3. Mỗi mục danh sách bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
2.

Các mục danh sách sẽ được đánh dấu bằng các số theo mặc định:



Danh sách mô tả HTML

HTML cũng hỗ trợ danh sách mô tả.

Danh sách mô tả là một danh sách các điều khoản, với một mô tả của mỗi thuật ngữ.

Thẻ

<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
5 xác định danh sách mô tả, thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
6 xác định thuật ngữ (tên) và thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
7 mô tả từng thuật ngữ:

Thí dụ

& nbsp; Cà phê & NBSP; - Đồ uống nóng đen & NBSP; Sữa & nbsp; - Đồ uống lạnh trắng
 

Coffee

 
- black hot drink

 
Milk

 
- white cold drink

Hãy tự mình thử »


Danh sách HTML chưa được đặt hàng

Một danh sách không có thứ tự bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
1. Mỗi mục danh sách bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
2.
Các mục danh sách sẽ được đánh dấu bằng đạn (vòng tròn nhỏ màu đen) theo mặc định:
Đặt hàng danh sách HTMLMột danh sách được đặt hàng bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
3. Mỗi mục danh sách bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
2.
Đặt hàng danh sách HTMLMột danh sách được đặt hàng bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
3. Mỗi mục danh sách bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
2.
Đặt hàng danh sách HTMLMột danh sách được đặt hàng bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
3. Mỗi mục danh sách bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
2.
Đặt hàng danh sách HTMLMột danh sách được đặt hàng bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
3. Mỗi mục danh sách bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
2.
Đặt hàng danh sách HTMLMột danh sách được đặt hàng bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
3. Mỗi mục danh sách bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
2.
Đặt hàng danh sách HTMLMột danh sách được đặt hàng bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
3. Mỗi mục danh sách bắt đầu với thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
2.

Các mục danh sách sẽ được đánh dấu bằng các số theo mặc định:



Bản tóm tắt

Bài viết này giới thiệu ba loại danh sách trong HTML và khám phá các tính năng cơ bản của chúng.

Giới thiệu

Danh sách được sử dụng để nhóm các phần thông tin liên quan với nhau để chúng được liên kết rõ ràng với nhau và dễ đọc. Trong phát triển web hiện đại, danh sách là các yếu tố công việc, thường được sử dụng để điều hướng cũng như nội dung chung.

Danh sách là tốt từ quan điểm cấu trúc vì chúng giúp tạo ra một tài liệu có cấu trúc tốt, dễ tiếp cận hơn, dễ bảo trì. Chúng cũng hữu ích vì chúng cung cấp các yếu tố chuyên dụng mà bạn có thể đính kèm các kiểu CSS. Cuối cùng, danh sách chính xác về mặt ngữ nghĩa giúp khách truy cập đọc trang web của bạn và họ đơn giản hóa việc bảo trì khi các trang của bạn cần được cập nhật.

Ba loại danh sách

Có ba loại danh sách trong HTML:

  • Danh sách không được đặt hàng - Được sử dụng để nhóm một tập hợp các mục liên quan theo thứ tự cụ thể — used to group a set of related items in no particular order
  • Danh sách được đặt hàng - Được sử dụng để nhóm một tập hợp các mục liên quan theo thứ tự cụ thể — used to group a set of related items in a specific order
  • Danh sách mô tả - Được sử dụng để hiển thị các cặp tên/giá trị như thuật ngữ và định nghĩa — used to display name/value pairs such as terms and definitions

Mỗi loại danh sách có một mục đích và ý nghĩa cụ thể trong một trang web.

Danh sách chưa được đặt hàng

Danh sách không có thứ tự (viên đạn) được sử dụng khi một tập hợp các mục có thể được đặt theo bất kỳ thứ tự nào. Một ví dụ là một danh sách mua sắm:

  • Sữa
  • bánh mì
  • Hạt cà phê

Mặc dù các mục đều là một phần của một danh sách, bạn có thể đặt các mục theo bất kỳ thứ tự nào và danh sách vẫn có ý nghĩa:

  • bánh mì
  • Hạt cà phê
  • Sữa

Hạt cà phê

Mặc dù các mục đều là một phần của một danh sách, bạn có thể đặt các mục theo bất kỳ thứ tự nào và danh sách vẫn có ý nghĩa:

Bạn có thể sử dụng CSS để thay đổi viên đạn thành một trong một số kiểu mặc định, sử dụng hình ảnh của riêng bạn hoặc thậm chí hiển thị danh sách mà không cần đạn - chúng tôi sẽ xem xét cách thực hiện điều đó trong danh sách kiểu dáng và liên kết.

<ul>
  <li>breadli>
  <li>coffee beansli>
  <li>milkli>
  <li>butterli>
ul>

Danh sách không có thứ tự đánh dấu

Danh sách chưa được đặt hàng sử dụng một bộ thẻ

<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
8 được bọc xung quanh một hoặc nhiều bộ thẻ
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
9:

  1. Danh sách đặt hàng
  2. Danh sách được đặt hàng (được đánh số) được sử dụng để hiển thị danh sách các mục nên theo thứ tự cụ thể. Một ví dụ sẽ là hướng dẫn nấu ăn:
  3. Thu thập các thành phần
  4. Trộn các thành phần với nhau
  5. Đặt nguyên liệu vào một món nướng
  6. Nướng trong lò trong một giờ
  7. Lấy ra khỏi lò

Cho phép đứng trong mười phút

  1. Danh sách đặt hàng
  2. Trộn các thành phần với nhau
  3. Lấy ra khỏi lò
  4. Đặt nguyên liệu vào một món nướng
  5. Thu thập các thành phần
  6. Nướng trong lò trong một giờ
  7. Danh sách được đặt hàng (được đánh số) được sử dụng để hiển thị danh sách các mục nên theo thứ tự cụ thể. Một ví dụ sẽ là hướng dẫn nấu ăn:

Thu thập các thành phần

  • Trộn các thành phần với nhau
    • Đặt nguyên liệu vào một món nướng
    • Nướng trong lò trong một giờ
    • Lấy ra khỏi lò
  • Cho phép đứng trong mười phút
    • Phục vụ
    • Nếu các mục danh sách được chuyển sang một thứ tự khác, thông tin sẽ không còn có ý nghĩa:
    • Danh sách được đặt hàng có thể được hiển thị với một số tùy chọn giải trình tự. Mặc định trong hầu hết các trình duyệt là số thập phân, nhưng có các số khác có sẵn:
    • Bức thư
    • Chữ thường ASCII chữ cái (a, b, c…)
    • Các chữ cái ASCII từ dưới (A, B, C,).

Tiếng Hy Lạp cổ điển viết thường: (έ, ή ί ί))

Số

Số thập phân (1, 2, 3,)

<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>

Số thập phân với số không hàng đầu (01, 02, 03,)

Chữ số La Mã thường (i, ii, iii,)

<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
ol>

<p>Before you place the ingredients in the baking dish, preheat the oven to
180 degrees centigrade/350 degrees fahrenheit in readiness for the next step.p>

<ol start="4">
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>

Điều này cho kết quả sau:

  1. Thu thập các thành phần
  2. Trộn các thành phần với nhau
  3. Đặt nguyên liệu vào một món nướng

Trước khi bạn đặt các thành phần trong món nướng, làm nóng lò nướng đến 180 độ Centigrade/350 độ Fahrenheit sẵn sàng cho bước tiếp theo.

  1. Nướng trong lò trong một giờ
  2. Lấy ra khỏi lò
  3. Cho phép đứng trong mười phút
  4. Phục vụ

Lưu ý rằng thuộc tính này đã được không dùng nữa trong HTML 4, do đó, nó sẽ ngăn trang của bạn xác thực nếu bạn đang sử dụng HTML4 nghiêm ngặt do DocType. Nếu bạn muốn sử dụng các chức năng như vậy trong một trang nghiêm ngặt HTML4 và nó hoàn toàn phải xác nhận, bạn có thể thực hiện nó bằng cách sử dụng bộ đếm CSS thay thế. Tuy nhiên, may mắn thay, thuộc tính

<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
ol>

<p>Before you place the ingredients in the baking dish, preheat the oven to
180 degrees centigrade/350 degrees fahrenheit in readiness for the next step.p>

<ol start="4">
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
2 đã được khôi phục trong HTML5.

Danh sách mô tả

Danh sách mô tả (trước đây được gọi là danh sách định nghĩa, nhưng được đổi tên trong HTML5) liên kết các tên và giá trị cụ thể trong danh sách. Các ví dụ có thể là các mục trong một danh sách thành phần và mô tả của họ, tác giả bài viết và bios ngắn gọn, hoặc người chiến thắng cạnh tranh và những năm mà họ giành chiến thắng. Bạn có thể có nhiều nhóm giá trị tên như bạn muốn, nhưng phải có ít nhất một tên và ít nhất một giá trị trong mỗi cặp.

Danh sách mô tả rất linh hoạt: Bạn có thể liên kết nhiều hơn một giá trị với một tên hoặc ngược lại. Ví dụ, thuật ngữ cà phê có thể có một số ý nghĩa và bạn có thể cho họ xem lần này đến lần khác:

coffee

  a beverage made from roasted, ground coffee beans
  a cup of coffee
  a social gathering at which coffee is consumed
  a medium to dark brown colour

Hoặc, bạn có thể liên kết nhiều hơn một tên có cùng giá trị. Điều này rất hữu ích để hiển thị các biến thể của một thuật ngữ, tất cả đều có cùng ý nghĩa:

soda
pop
fizzy drink
cola

  a sweet, carbonated beverage

Mô tả Danh sách đánh dấu

Danh sách mô tả Sử dụng một bộ thẻ

<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
ol>

<p>Before you place the ingredients in the baking dish, preheat the oven to
180 degrees centigrade/350 degrees fahrenheit in readiness for the next step.p>

<ol start="4">
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
4 được bao quanh một hoặc nhiều nhóm
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
ol>

<p>Before you place the ingredients in the baking dish, preheat the oven to
180 degrees centigrade/350 degrees fahrenheit in readiness for the next step.p>

<ol start="4">
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
5 (tên) và
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
ol>

<p>Before you place the ingredients in the baking dish, preheat the oven to
180 degrees centigrade/350 degrees fahrenheit in readiness for the next step.p>

<ol start="4">
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
6 (giá trị). Bạn phải ghép ít nhất một
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
ol>

<p>Before you place the ingredients in the baking dish, preheat the oven to
180 degrees centigrade/350 degrees fahrenheit in readiness for the next step.p>

<ol start="4">
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
5 với ít nhất một
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
ol>

<p>Before you place the ingredients in the baking dish, preheat the oven to
180 degrees centigrade/350 degrees fahrenheit in readiness for the next step.p>

<ol start="4">
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
6 và
<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
ol>

<p>Before you place the ingredients in the baking dish, preheat the oven to
180 degrees centigrade/350 degrees fahrenheit in readiness for the next step.p>

<ol start="4">
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
5 phải luôn luôn đến trước theo thứ tự nguồn.

Một danh sách mô tả đơn giản các tên đơn với các giá trị đơn sẽ trông như thế này:

<dl>
  <dt>Namedt>
  <dd>Valuedd>
  <dt>Namedt>
  <dd>Valuedd>
  <dt>Namedt>
  <dd>Valuedd>
dl>

Điều này được hiển thị như sau:

Name
  Value
Name
  Value
Name
  Value

Trong ví dụ sau, chúng tôi liên kết nhiều hơn một giá trị với một tên và ngược lại:

<dl>
  <dt>Name1dt>
  <dd>Value that applies to Name1dd>
  <dt>Name2dt>
  <dt>Name3dt>
  <dd>Value that applies to both Name2 and Name3dd>
  <dt>Name4dt>
  <dd>One value that applies to Name4dd>
  <dd>Another value that applies to Name4dd>
dl>

Mã đó sẽ hiển thị như thế này:

Name1
  Value that applies to Name1
Name2
Name3
  Value that applies to both Name2 and Name3
Name4
  One value that applies to Name4
  Another value that applies to Name4

Lựa chọn giữa các loại danh sách

Khi cố gắng quyết định loại danh sách nào sẽ sử dụng, hãy tự hỏi mình hai câu hỏi đơn giản:

  1. Tôi đang xác định các điều khoản hoặc liên kết các cặp tên/giá trị khác?

    • Nếu có, sử dụng một danh sách mô tả.
    • Nếu không, don lồng sử dụng một danh sách mô tả.
  2. Là thứ tự của các mục danh sách quan trọng?

    • Nếu có, sử dụng một danh sách đặt hàng.
    • Nếu không, sử dụng một danh sách không có thứ tự.

Ưu điểm danh sách HTML

  • Tính linh hoạt: Nếu bạn phải thay đổi thứ tự của các mục trong danh sách trong danh sách đã đặt hàng, bạn chỉ cần di chuyển xung quanh các yếu tố mục danh sách; Khi trình duyệt hiển thị danh sách, nó sẽ được đặt hàng đúng cách.
  • Kiểu dáng: Sử dụng danh sách HTML cho phép bạn tạo kiểu danh sách bằng cách sử dụng CSS. Các thẻ mục danh sách
    <ol>
      <li>Gather ingredientsli>
      <li>Mix ingredients togetherli>
      <li>Place ingredients in a baking dishli>
      <li>Bake in oven for an hourli>
      <li>Remove from ovenli>
      <li>Allow to stand for ten minutesli>
      <li>Serveli>
    ol>
    
    2 khác với các thẻ khác trong tài liệu của bạn, do đó bạn có thể nhắm mục tiêu cụ thể các quy tắc CSS cho chúng.
  • Semantics: Danh sách HTML cung cấp cho nội dung cấu trúc ngữ nghĩa phù hợp. Điều này có những lợi ích quan trọng, chẳng hạn như cho phép người đọc màn hình nói với người dùng khiếm thị rằng họ đang đọc một danh sách, thay vì chỉ đọc một mớ bòng bong khó hiểu về văn bản và số.

Để đặt nó theo cách khác, các mục danh sách mã don bằng cách sử dụng các thẻ văn bản thông thường. Sử dụng văn bản thay vì một danh sách làm cho nhiều công việc hơn cho bạn và có thể tạo sự cố cho độc giả tài liệu của bạn. Vì vậy, nếu tài liệu của bạn cần một danh sách, bạn nên sử dụng định dạng danh sách HTML chính xác.don’t code list items using regular text tags. Using text instead of a list makes more work for you and can create problems for your document’s readers. So if your document needs a list, you should use the correct HTML list format.

Danh sách làm tổ

Một mục danh sách cá nhân có thể chứa toàn bộ danh sách khác, được gọi là danh sách lồng nhau. Nó rất hữu ích cho những thứ như bảng nội dung có chứa các phần phụ:

1. Chapter One
    a. Section One
    b. Section Two
    c. Section Three
2. Chapter Two
3. Chapter Three

Để phản ánh rằng trong mã, toàn bộ danh sách lồng nhau được chứa bên trong mục danh sách đầu tiên. Mã trông như thế này:

<ol>
  <li>Gather ingredientsli>
  <li>Mix ingredients togetherli>
  <li>Place ingredients in a baking dishli>
  <li>Bake in oven for an hourli>
  <li>Remove from ovenli>
  <li>Allow to stand for ten minutesli>
  <li>Serveli>
ol>
0

Lưu ý rằng chúng tôi đã sử dụng thuộc tính

coffee

  a beverage made from roasted, ground coffee beans
  a cup of coffee
  a social gathering at which coffee is consumed
  a medium to dark brown colour
1 CSS để sắp xếp danh sách lồng nhau với các chữ cái chữ thường thay vì số thập phân.

Danh sách lồng nhau khá hữu ích và thường tạo thành cơ sở cho các menu điều hướng, vì chúng là một cách tốt để xác định cấu trúc phân cấp của trang web. Chúng cũng rất linh hoạt, vì các danh sách được đặt hàng hoặc không có thứ tự có thể được lồng bên trong các mục danh sách được đặt hàng hoặc không đặt hàng. Để biết ví dụ về các danh sách không có thứ tự trong danh sách được đặt hàng, hãy xem Lựa chọn trong số các loại danh sách ở trên.

Về mặt lý thuyết, bạn có thể làm tổ danh sách đến bất kỳ cấp độ nào bạn thích, mặc dù trong thực tế, nó có thể trở nên khó hiểu đối với danh sách tổ quá sâu. Đối với các danh sách rất lớn, bạn có thể tốt hơn khi chia nội dung thành nhiều danh sách với các tiêu đề thay thế, hoặc thậm chí chia nó thành các trang riêng biệt. Một quy tắc tốt là, don lồng liệt kê sâu hơn ba cấp độ.

Sự kết luận

Trong bài viết này, bạn đã thấy cách các loại danh sách HTML khác nhau được sử dụng, cách chúng được mã hóa và khám phá một số tùy chọn danh sách cơ bản. Để biết thông tin cụ thể hơn về việc sửa đổi sự xuất hiện và hành vi của danh sách HTML, xem danh sách kiểu dáng và liên kết.

Xem thêm

Tài nguyên bên ngoài

  • Một danh sách khác biệt: danh sách thuần hóa
  • W3C CSS2: Định nghĩa kiểu kiểu danh sách

Câu hỏi tập thể dục

  • Ba loại danh sách HTML là gì?
  • Khi nào bạn sẽ sử dụng từng loại danh sách? Làm thế nào bạn sẽ chọn giữa họ?
  • Làm thế nào để bạn làm tổ danh sách?
  • Tại sao bạn nên sử dụng CSS thay vì HTML để tạo kiểu danh sách của mình?

Ba loại danh sách là gì?

Một ví dụ về ba loại danh sách, là danh sách không có thứ tự, danh sách được đặt hàng và danh sách định nghĩa.unordered list, ordered list, and definition list.

Các loại danh sách khác nhau trong HTML là gì?

Có ba loại danh sách trong HTML: Danh sách không theo thứ tự hoặc danh sách Bulleted (UL) Danh sách được đặt hàng hoặc danh sách được đánh số (OL) Danh sách mô tả hoặc Danh sách định nghĩa (DL)Unordered list or Bulleted list (ul) Ordered list or Numbered list (ol) Description list or Definition list (dl)

Các loại danh sách là gì?

Các loại danh sách..
Danh sách xô.Chẳng hạn như "100 điều cần làm trước khi bạn chết".....
Những việc cần làm.Chẳng hạn như "Nhiệm vụ cuối tuần để hoàn thành".....
Danh sách tốt nhất.Chẳng hạn như "10 bộ phim hàng đầu mọi thời đại".....
Danh mục hàng tồn kho.Chẳng hạn như "các mặt hàng để bán" ..
Danh sách động não.Chẳng hạn như danh sách này.....
Danh sách chỉ mục.Một danh sách các danh sách.....
Danh mục.....
Danh sách thời gian ..