list จัดข้อมูลในเว็บเพจให้เป็นระเบียบด้วยHTML
list tag ใช้ในการจัดข้อมูลเป็นชุดๆ หรือเป็นหัวข้อ ซึ่งจะทำให้ข้อมูลอ่านได้ง่ายขึ้น ซึ่ง list แบ่งได้เป็น 2 แบบด้วยกัน1.list แบบไม่มีลำดับ
เป็น list แบบง่ายดีสุดเหมาะสำหรับการนำเสนอข้อมูลที่ไม่มีลำดับเกี่ยวข้อง โดยมีรูปแบบดังนี้
รูปแบบ list แบบไม่มีลำดับ
<UL> <LH> หัวข้อ </LH> <LI> ข้อมูล 1 </LI> <LI> ข้อมูล 2 </LI> </UL> |
2.list แบบมีลำดับ
เป็น list แบบง่ายดีสุดเหมาะสำหรับการนำเสนอข้อมูลที่ไม่มีลำดับเกี่ยวข้อง โดยมีรูปแบบดังนี้
รูปแบบ list แบบมีลำดับ
<OL> <LH> หัวข้อ </LH> <LI> ข้อมูล 1 </LI> <LI> ข้อมูล 2 </LI> </OL> |
3.การใส่สัญลักษณ์ให้กับ list
การใส่สัญลักษณ์ให้กับ list เราจะเห็นสัญลักษณ์หน้า list อยู่แล้วซึ่งสัญลักษณ์ตัวนั้นสามารถเปลี่ยนแปลงได้โดยใช้ Attibuet คำสั่ง type มีรายละเอียดดังนี้
สัญลักษณ์ที่ใช้กับแบบไม่มีลำดับ
TYPE | สัญลักษณ์ |
disc | วงกลมทึบ |
circle | วงกลมโปร่งใส |
square | สี่เหลี่ยมทึบ |
สัญลักษณ์ที่ใช้กับแบบมีลำดับ
TYPE | สัญลักษณ์ |
A | เรียงแบบ A,B,C |
a | เรียงแบบ a,b,c |
I | เรียงแบบเลขโรมัน I,II,III |
i | เรียงแบบเลขโรมัน i,ii,iii |
<UL>
<LH> หัวข้อ </LH>
<LI Type="square"> ข้อมูล 1 </LI>
<LI> ข้อมูล 2 </LI>
</UL>
4.การใช้ list ซ้อน list
ในตัวอย่างจะเป็นการทำ list ซ้อน list ซึ่ง html จะเปลี่ยนสัญลักษณ์ให้อัตโนมัติ
<ul>
<li>ยานพาหนะ 2 ล้อ</li>
<li>ยานพาหนะ 4 ล้อ
<ul>
<li>รถกะบะ</li>
<li>รถเก๋ง</li>
</ul>
</li>
<li>ยานพาหนะทางน้ำ</li>
</ul>
Definition list เป็น list ที่ใช้กับการให้คำจำกัดความ ดังตัวอย่าง
<dl>
<dt>HTML</dt>
<dd>(ชื่อเต็มคือ Hypertext Markup Language ภาษามาร์กอัปข้อความหลายมิติ) คือภาษามาร์กอัปออกแบบมาเพื่อใช้ในการสร้างเว็บเพจ หรือข้อมูลอื่นที่เรียกดูผ่านทางเว็บเบราว์เซอร์ เริ่มพัฒนาโดย ทิม เบอร์เนอรส์ ลี (Tim Berners Lee) </dd>
<dt>WEBSITE</dt>
<dd>(website, web site, หรือ Web site) หมายถึง หน้าเว็บเพจหลายหน้า ซึ่งเชื่อมโยงกันผ่านทางไฮเปอร์ลิงก์ ส่วนใหญ่จัดทำขึ้นเพื่อนำเสนอข้อมูลผ่านคอมพิวเตอร์ </dd>
</dl>
list เป็นคำสั่งที่ใช้สำหรับการแสดงข้อมูลเป็นชุดๆ ซึ่งจะสะดวกและ อ่านข้อมูลได้ง่าย เป็นทางเลือกทางหนึ่งที่ดีในการใช้แสดงบทความ