คำสั่งรายการ [ Lists ]
- การแสดงข้อมูลแบบรายการเป็นส่วนที่ทำให้เกิดความสะดวก,รวดเร็วในการอธิบายรายละเอียดต่างๆ
ของข้อมูลในกรณีที่มีข้อมูลจำนวนมาก ซึ่งจะมีลักษณะการแสดงผล 3 แบบ คือ
- แบบมีหมายเลขกำกับ ( Number Styles )
- แบบมีสัญลักษณ์กำกับ ( Bulleted Styles )
- แบบไม่มีสัญลักษณ์กำกับ ( No Bulleted Styles )
|
การแสดงรายการแบบมีหมายเลขกำกับ ( Number Styles / Order Lists )
รูปแบบคำสั่ง
<OL TYPE="รูปแบบ">.................
<LI>..................
<LI>..................
<LI>...................
-
-
<Lx>.................
</OL>
|
มีการแสดงแบบเรียงลำดับหลายรูปแบบ เช่น ตัวอักษร, ตัวเลข ฯลฯ
ตัวอย่างการใช้คำสั่ง
<HTML>
<HEAD>
<TITLE>การแสดงรายการแบบมีหมายเลขกำกับ </TITLE>
</HEAD>
<BODY>
ทดสอบ
<OL TYPE="A">
<LI>รายการที่1
<LI>รายการที่2
<LI>รายการที่3
</OL>
</BODY>
</HTML>
|
การแสดงผล
ทดสอบ
- รายการที่1
- รายการที่2
- รายการที่3
|
|
การแสดงรายการแบบมีสัญลักษณ์กำกับ ( Bulleted Styles )
รูปแบบคำสั่ง
<UL TYPE="รูปแบบ">.................
<LI>..................
<LI>..................
<LI>...................
-
-
<Lx>.................
</UL>
|
มีการแสดงสัญลักษณ์ 3 รูปแบบ คือ disc , circle , square
ตัวอย่างการใช้คำสั่ง
<HTML>
<HEAD>
<TITLE>การแสดงรายการแบบมีสัญลักษณ์กำกับ ( Bulleted Styles ) </TITLE>
</HEAD>
<BODY>
ทดสอบ DISC
<UL type="disc">
<LI>รายการที่1
<LI>รายการที่2
<LI>รายการที่3
</UL>
ทดสอบ CIRCLE
<UL type="circle">
<LI>รายการที่1
<LI>รายการที่2
<LI>รายการที่3
</UL>
ทดสอบ SQUARE
<UL type="square">
<LI>รายการที่1
<LI>รายการที่2
<LI>รายการที่3
</UL>
</BODY>
</HTML>
|
การแสดงผล
ทดสอบแบบ DISC
- รายการที่1
- รายการที่2
- รายการที่3
ทดสอบแบบ CIRCLE
- รายการที่1
- รายการที่2
- รายการที่3
ทดสอบแบบ SQUARE
- รายการที่1
- รายการที่2
- รายการที่3
|
|
การแสดงแบบรายการแบบไม่มีสัญลักษณ์กำกับ ( No Bulleted Styles )
รูปแบบคำสั่ง
<DL>คำจำกัดความ
<DT>คำจำกัดความย่อย
<DD>รายละเอียด
</DL>
| |
ตัวอย่างการใช้คำสั่ง
<HTML>
<HEAD>
<TITLE>การแสดงแบบรายการแบบไม่มีสัญลักษณ์กำกับ ( No Bulleted Styles ) </TITLE>
</HEAD>
<BODY>
<DL>หัวข้อ
<DT>รายการที่1
<DD>รายละเอียด 1.1</DD>
<DD>รายละเอียด 1.2</DD>
<DD>รายละเอียด 1.3</DD>
</DT>
<DT>รายการที่2
<DD>รายละเอียด 2.1</DD>
<DD>รายละเอียด 2.2</DD>
<DD>รายละเอียด 2.3</DD>
</DT>
</DL>
</BODY>
</HTML>
|
|
การแสดงผล
หัวข้อ
- รายการที่1
- รายละเอียด 1.1
- รายละเอียด 1.2
- รายละเอียด 1.3
- รายการที่2
- รายละเอียด 2.1
- รายละเอียด 2.2
- รายละเอียด 2.3
|
|
|