Accessibility Links

• Skip to Content
• Skip to Main Navigation
• Skip to thaicss.com Search
• Accessibility help
• Access keys help
• 

 

List หรือ ข้อมูลที่เป็นลิสต์ (ol, ul, dl)

โดย พร อันทะ เมื่อ 2007-10-01 20:13:31 ดูทั้งหมด 383 ครั้ง

ในขั้นต้นของการคิดวิเคราะห์ข้อมูลที่จะนำมาทำเป็น list ในรูปแบบต่างๆ ความเข้าใจในพื้นฐานของความเป็น list คือสิ่งสำคัญ เราจะรู้ได้อย่างไรว่าอันไหนคือ list ที่ต้องเรียงลำดับ (ol) อันไหนคือ list ที่ไม่ต้องเรียงลำดับ (ul) หรืออันไหนคือ list ของข้อมูลที่มีขอบข่ายของหัวข้อและการบรรยายที่กว้างและมากออกไป (dl)

เนื้อหาในบทความนี้เราจะมาดูกันว่าเราจะเลือกใช้ Element กับข้อมูลที่เราต้องการนำเสนอให้เหมาะสมอย่างไร

List ทั้ง 3 รูปแบบ

1. ol หรือ ordered list คือ list ที่ต้องการนำเสนอแบบเรียงลำดับ เช่น ข้อ 1,2,3,... ไปเรื่อยๆ

ตัวอย่างการใช้

<h1> ข้อดีของการทำเว็บแบบ Height Accessibility </h1>
<p> การทำเว็บเพื่อให้ง่ายและมีประสิทธิภาพการเข้าถึงข้อมูล  แบบสุดยอด มีประโยชน์เป็นข้อๆ ดังนี้  </p>
<ol>
    <li>  สามารถทำให้หน้าเว็บมีคุณค่ามากกว่าเดิม  </li>
    <li>  Robots ชอบใจและแวะเวียนมาเยี่ยมบ่อยกว่าเดิม  </li>
    <li>  เว็บถูกหลักอนามัยเหมาะสำหรับการเข้าถึงทุกรูปแบบ  </li>
    <li>  ฯลฯ </li>
</ol>

การแสดงผล Ol

ข้อมูลที่เขียนขึ้นข้างต้นจะถูกนำเสนอออกมาในลักษณะ header ของ h1, description ของ paragraph ของ p และข้อมูลที่เป็น list ที่ถูกเรียงเป็นข้อๆ 1,2,3,4... ของ ol นั่นเอง

2. ul หรือ unordered list คือ list ที่ไม่ต้องการการเรียงลำดับ แต่เน้นการนำเสนอเพื่อสร้างความเข้าใจเป็นหลัก โดยจาก ol ที่มีเลขหน้า ค่าปกติพื้นฐานจะถูกเปลี่ยนมาเป็น bullet (•) นำหน้าแทน

ตัวอย่างการใช้ ul

<h1> เอกสารที่ต้องเตรียมให้พร้อมเมื่อต้องเข้าร่วมสัมมนา  </h1>
<p> ผู้เข้าร่วมฟังการสัมมนาในครั้งนี้  ควรจะมีอุปกรณ์ส่วนตัวที่ต้องเตรียมมา เว้นแต่ว่าหามิได้ </p>
<ul>
    <li>  ถุงยางอนามัย  </li>
    <li>  ปืน </li>
    <li>  กางเกงยีนส์  </li>
    <li>  มะละกอ </li>
</ul>

การแสดงผล Ul

ข้อมูลที่ถูกนำเสนอแบบ ul จะเน้นไปที่การนำเสนอเป็น list อย่างเดียว โดยไม่ได้เน้นว่าอะไรสำคัญ มาก่อนหลัง หรือการนับเป็นจำนวนข้อๆ ซึ่งนั่นคือข้อแตกต่างที่พอสรุปได้แบบสังเขปของการใช้ ol และ ul

จาก list ทั้งสองแบบที่กล่าวมาข้างต้น การนำเสนอข้อมูลจะถูกใช้โดย <li> หรือ list ซึ่งเป็น Definition ของทั้ง ol และ ul นั่นเอง

ในเรื่องต่อไป เราจะมาดูการใช้ dl dt dd กันครับ

• • ยังไม่มีความคิดเห็น
  • แสดงความคิดเห็นกับ : List หรือ ข้อมูลที่เป็นลิสต์ (ol, ul, dl)

• About Author: พร อันทะ

  • 
  • พร อันทะ

Back to Top

Tags:

1. xhtml
2. ol
3. ul

เนื้อหาที่เกี่ยวข้อง

1. การสร้างแบบฟอร์มอย่างถูกวิธี 2
2. การสร้าง Graph โดยใช้ XHTML CSS
3. การสร้างแบบฟอร์มอย่างถูกวิธี
4. รู้จักกับ common attribute ของ xhtml
5. เมื่อ Crawler ต้องเจอ XHTML ป่วยๆ

หรือกำลังสนใจ

1. พัดผ่าน

Unknown Version Unknown