การสร้างลิสต์รายการ คือ การนำเสนอข้อมูลอีกรูปแบบเพื่อช่วยยกข้อมูลที่เป็นประเด็นมาจัดเป็นรายการหรือลิสต์ 1. การสร้างลิสต์แบบไม่มีลำดับ ลิสต์แบบไม่เรียงลำดับ (Unordered List) เป็นลิสต์ที่เหมาะสำหรับการนำเสนอข้อมูลที่เป็นประเด็นสั้น ๆ ไม่ต้องการของตัวเลข หรือตัวอักษรให้ยุ่งยาก รูปแบบการใช้แท็ก <ul> <ul> <li>รายการ1</li> </ul> การกำหนดรายละเอียดแอตทริบิวต์ type <ul type=“ชนิดเครื่องหมาย”> ค่าที่กำหนด ชนิดของเครื่องหมายหน้าลำดับ เช่น disc, circle, และ square หากไม่มีการกำหนดชนิดของเครื่องหมายหน้ารายการจะแสดงวงกลมทึบเป็นเครื่องหมายปกติ ตัวอย่างการกำหนดเครื่องหมายให้กับลิสต์แบบไม่มีลำดับ <!DOCTYPE HTML> <html> <head> <title>การกำหนดเครื่องหมายให้กับลิสต์แบบไม่มีลำดับ</title> </head> <body> <ul type=”circle”>สถานที่ท่องเที่ยวอำเภอเกาะคา จังหวัดลำปาง <li type=”disc”>วัดพระธาตุลำปางหลวง</li> <li type=”square”>วัดไหล่หินหลวง</li> <li>วัดพระธาตุจอมปิง</li> </ul> </body> </html> ผลลัพธ์ที่ได้  2. การสร้างลิสต์แบบมีลำดับ ลิสต์แบบเรียงลำดับ จะเป็นการนำเสนอข้อมูลรายการแบบมีตัวเลข ตัวอักษร ซึ่งลิสต์แบบนี้นำมาใช้เพื่อบอกให้ทราบลำดับของข้อมูลที่นำเสนอ รูปแบบการใช้งานแท็ก <ol> <ol> <li>รายการ1</li> </ol> การกำหนดชนิดของตัวจัดลำดับ <ul type=“ชนิดของลำดับ”> ค่าที่กำหนด ชนิดของลำดับหน้าหัวข้อ เช่น A, a, I (ไอตัวใหญ่), i และ 1
ตัวอย่างการกำหนดเครื่องหมายให้กับลิสต์แบบมีลำดับ <html> <head> <title>การกำหนดเครื่องหมายให้กับลิสต์แบบมีลำดับ</title> </head> <body> <ol type=”1″>สถานที่ท่องเที่ยวอำเภอเกาะคา จังหวัดลำปาง <li>วัดพระธาตุลำปางหลวง</li> <li>วัดไหล่หินหลวง</li> <li>วัดพระธาตุจอมปิง</li> </ol> </body> </html> ผลลัพธ์ที่ได้ การกำหนดลำดับเริ่มต้นให้กับข้อมูล <ol start=“ตัวเลข”> และ <li value=“ตัวเลข”> ค่าที่กำหนด เป็นการกำหนดเลขเริ่มต้นของลำดับ ตัวอย่างการใช้งาน <!DOCTYPE HTML> <head> <title>การกำหนดเลขเริ่มต้นของลำดับ</title> </head> <body> 5 อับดับหนังสือขายดีประจำร้าน <ol>หมวดคอมพิวเตอร์ <li>Photoshop CS5</li> <li>เรียนลัดการสร้างเว็บ</li> <li>การสร้างงานนำเสนอ</li> </ol> <ol start=”4″>หมวดทั่วไป <li>ชีวิตยิ่งกว่าละคร</li> <li>ความฝันของนายโข่ง</li> </ol> </body> </html> ผลลัพธ์ที่ได้ 3. การสร้างลิสต์แบบแบบจำกัดความ ลิสต์แบบจำกัดความ (Definition List) มักถูกนำไปใช้กับการจำกัดความ โดยมีการแบ่งลิสต์เป็น 2 ส่วน เช่น พจนานุกรม ส่วนแรก คือ คำศัพท์ ส่วนที่สอง คือ คำจำกัดความ จะเยื้องไปหลังคำศัพท์ รูปแบบการใช้งานแท็ก <dl> <dl> <dt>คำศัพท์</dt> </dl> ตัวอย่างการใช้งาน <!DOCTYPE HTML> <head> <title>การสร้างลิสต์แบบแบบจำกัดความ</title> </head> <body> <dl>อธิบายคำศัพท์อินเทอร์เน็ต <dt>HTTP</dt> <dd>โพรโตคอลในการสืบค้นข้อมูล</dd> <dt>FTP</dt> <dd>โพรโตคอลในการโอนย้ายไฟล์ข้อมูล</dd> </dl> </body> </html> ผลลัพธ์ที่ได้ 4. การสร้างลิสต์ซ้อนลิสต์ การสร้างลิสต์แบบซ้อนกันมีประโยชน์ในการนำเสนอข้อมูลที่มีหัวข้อย่อย หรือขั้นตอนมาก ซึ่งสามารถนำมาประยุกต์ใช้ในการตั้งโจทย์คำถามที่คำตอบยาก ๆ ได้ ตัวอย่างการใช้งาน <!DOCTYPE HTML> <head> <title>การสร้างลิสต์ซ้อนลิสต์</title> </head> <body> <ol> <li>จังหวัดใดอยู่ในภาคเหนือตอนบน</li> <ol type=”a”> <li>เชียงใหม่</li> <li>เพชรบูรณ์</li> <li>ตาก</li> <li>สุโขทัย</li> </ol> <li>จังหวัดใดอยู่ในภาคเหนือตอนล่าง</li> <ol type=”a”> <li>เชียงใหม่</li> <li>เพชรบูรณ์</li> <li>ลำปาง</li> <li>พะเยา</li> </ol> </ol> </body> </html> ผลลัพธ์ที่ได้ อ้างอิง
|
การสร้างลำดับรายการของข้อมูล list มีกี่แบบอะไรบ้าง
ลิขสิทธิ์ © 2024 th.ketiadaan Inc.
