HTML <li>แท็ก
ตัวอย่าง
รายการ HTML ที่เรียงลำดับ (<ol>) หนึ่งรายการและรายการ HTML ที่ไม่เรียงลำดับ (<ul>) หนึ่งรายการ:
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
ตัวอย่าง "ลองใช้เอง" เพิ่มเติมด้านล่าง
ความหมายและการใช้งาน
แท็ ก<li>กำหนดรายการ
แท็ ก<li>ถูกใช้ในรายการที่เรียงลำดับ ( <ol> ) รายการที่ไม่เรียงลำดับ ( <ul> ) และในรายการเมนู ( <menu> )
ใน <ul> และ <menu> รายการมักจะแสดงพร้อมสัญลักษณ์แสดงหัวข้อย่อย
ใน <ol> รายการมักจะแสดงด้วยตัวเลขหรือตัวอักษร
เคล็ดลับ:ใช้ CSS เพื่อจัด รูป แบบรายการ
รองรับเบราว์เซอร์
| Element | |||||
|---|---|---|---|---|---|
| <li> | Yes | Yes | Yes | Yes | Yes |
คุณลักษณะ
| Attribute | Value | Description |
|---|---|---|
| value | number | Only for <ol> lists. Specifies the start value of a list item. The following list items will increment from that number |
คุณสมบัติสากล
แท็ ก<li>ยังสนับสนุน Global Attributes ในHTML
คุณสมบัติของเหตุการณ์
แท็ ก<li>ยังสนับสนุนแอตทริบิวต์เหตุการณ์ใน HTML
ตัวอย่างเพิ่มเติม
ตัวอย่าง
การใช้แอตทริบิวต์ค่าในรายการเรียงลำดับ:
<ol>
<li value="100">Coffee</li>
<li>Tea</li>
<li>Milk</li>
<li>Water</li>
<li>Juice</li>
<li>Beer</li>
</ol>
ตัวอย่าง
ตั้งค่าประเภทสไตล์รายการต่างๆ (ด้วย CSS):
<ol>
<li>Coffee</li>
<li
style="list-style-type:lower-alpha">Tea</li>
<li>Milk</li>
</ol>
<ul>
<li>Coffee</li>
<li
style="list-style-type:square">Tea</li>
<li>Milk</li>
</ul>
ตัวอย่าง
สร้างรายการภายในรายการ (รายการที่ซ้อนกัน):
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
ตัวอย่าง
สร้างรายการซ้อนที่ซับซ้อนมากขึ้น:
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea
<ul>
<li>China</li>
<li>Africa</li>
</ul>
</li>
</ul>
</li>
<li>Milk</li>
</ul>
หน้าที่เกี่ยวข้อง
กวดวิชา HTML: รายการ HTML
การอ้างอิง HTML DOM: Li Object
กวดวิชา CSS: รายการจัดแต่งทรงผม
การตั้งค่า CSS เริ่มต้น
เบราว์เซอร์ส่วนใหญ่จะแสดง<li>องค์ประกอบด้วยค่าเริ่มต้นดังต่อไปนี้:
li {
display: list-item;
}