ให้เรตสมาชิก: 2 / 5

ดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน
 

บทที่ 13 HTML Lists
   HTML Lists  คือ การสร้างรายการใน html  รายการใน html มี 3 แบบด้วยกัน คือ
1.รายการแบบไม่มีลำดับ (unordered list) ใช้แท็ก <ul>
   รายการแบบไม่มีลำดับ จะใช้แท็ก <ul> (ย่อมาจาก unordered list) และแต่ละรายการภายในจะอยู่ในแท็ก <li> (ย่อมาจาก list item)
โดยแต่ละรายการจะแสดงเครื่องหมายด้วยจุดวงกลมสีดำ (โดยค่าเริ่มต้น)
ตัวอย่าง

<html>
<body>

<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

<ol start="50">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>
 
</body>
</html>

ผลลัพธ์คือ

2.รายการแบบมีลำดับ (ordered list) ใช้แท็ก <ol>

   รายการแบบมีลำดับ จะใช้แท็ก <ol> (ย่อมาจาก ordered list) และแต่ละรายการภายในจะอยู่ในแท็ก <li> (ย่อมาจาก list item) เหมือนกับแท็ก <ul>
โดยแต่ละรายการจะแสดงเป็นตัวเลขเรียกลำดับกันไป (โดยค่าเริ่มต้น)
ตัวอย่าง

<html>
<body>

<ol>
  <li>ผัดไทย</li>
  <li>บะหมี่</li>
  <li>สปาเกตตี้</li>
</ol>

<ol start="50">
  <li>ผัดไทย</li>
  <li>บะหมี่</li>
  <li>สปาเกตตี้</li>
</ol>
 
</body>
</html>

ผลลัพธ์คือ

3.รายการแบบคำนิยาม (definition list) ใช้แท็ก <dl>
   รายการแบบคำนิยาม คือ รายการของแต่ละข้อมูล และมีคำอธิบายของแต่ละรายการ
รายการแบบคำนิยามจะใช้แท็ก <dl> (ย่อมาจาก definition list ) และแต่ละรายการภายในจะอยู่ในแท็ก <dt> และ คำอธิบายของแต่ละแท็ก <dt> จะอยู่ในแท็ก <dd>
ตัวอย่าง

<html>
<body>

<dl>
  <dt>ผัดไทย</dt>
  <dd>วุ้นเส้น ทะเล</dd>
  
  <dt>บะหมี่</dt>
  <dd>แห้ง หมูแดง</dd>
</dl>

</body>
</html>

ผลลัพธ์คือ

Tag ที่เกี่ยวข้อง

<ol> กำหนดรายการที่มีลำดับ
<ul> กำหนดรายการที่ไม่มีลำดับ
<li> กำหนดข้อมูลของแต่ละรายการ
<dl> กำหนดรายการคำนิยาม
<dt> กำหนดข้อมูลของแต่ละรายการ
<dd> กำหนดคำอธิบายของแต่ละข้อมูล

 

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
เเชร์ความรู้ การใช้ Java script ในการลบ และเลือกใช้ข้อมูล
โดย chaiyasitpraphut จ 11 พ.ย. 2019 4:49 pm บอร์ด MT35 - นายชัยยะสิทธิ์ พระพุทธ
0
27
จ 11 พ.ย. 2019 4:49 pm โดย chaiyasitpraphut
ประโยชน์และการนำค่าเฉลี่ยเคลื่อนที่ไปใช้งาน
โดย numtan5839 จ 11 พ.ย. 2019 2:54 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
21
จ 11 พ.ย. 2019 2:54 pm โดย numtan5839
ค่าเฉลี่ยเคลื่อนที่ (Moving Average)
โดย numtan5839 จ 11 พ.ย. 2019 11:57 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
24
จ 11 พ.ย. 2019 11:57 am โดย numtan5839
Note
โดย chaiyasitpraphut จ 11 พ.ย. 2019 11:26 am บอร์ด MT35 - นายชัยยะสิทธิ์ พระพุทธ
0
2
จ 11 พ.ย. 2019 11:26 am โดย chaiyasitpraphut
การใช้ฟังก์ชัน SQRT ใน Excel
โดย numtan5839 จ 11 พ.ย. 2019 11:06 am บอร์ด Microsoft Office Knowledge & line & Etc
0
26
จ 11 พ.ย. 2019 11:06 am โดย numtan5839
งานประจำวันที่ 11 พฤศจิกายน 2562
โดย chaiyasitpraphut จ 11 พ.ย. 2019 10:39 am บอร์ด MT35 - นายชัยยะสิทธิ์ พระพุทธ
3
69
จ 11 พ.ย. 2019 6:05 pm โดย chaiyasitpraphut
list ความรู้ที่มี ว่าเคยเรียน หรือ เคยทำอะไรมาบ้าง
โดย chaiyasitpraphut จ 11 พ.ย. 2019 10:44 am บอร์ด MT35 - นายชัยยะสิทธิ์ พระพุทธ
2
56
อ 12 พ.ย. 2019 2:09 pm โดย chaiyasitpraphut
งานประจำวันที่ 11 พฤศจิกายน 2562
โดย numtan5839 จ 11 พ.ย. 2019 10:08 am บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
5
21
จ 11 พ.ย. 2019 7:05 pm โดย numtan5839
คู่เงินยอดนิยมใน Forex สำหรับเทรดเดอร์มือใหม่
โดย numtan5839 ส 09 พ.ย. 2019 5:40 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
70
ส 09 พ.ย. 2019 5:40 pm โดย numtan5839
ฝากเงินเข้าบัญชีกับไปรษณีย์ไทย ด้วยบริการ Bank@post
โดย numtan5839 ส 09 พ.ย. 2019 4:26 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
64
ส 09 พ.ย. 2019 4:26 pm โดย numtan5839
ติดตั้ง joomla เวอร์ชั่น 2.5.28 ไม่ได้ครับ
โดย jamepiyawat ส 09 พ.ย. 2019 2:44 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS CRM
1
41
ส 09 พ.ย. 2019 3:39 pm โดย mindphp
ช่วยแนะนำ เกี่ยวกับ javascript library ที่ใช้ทำ รุปภาพให้หน่อยครับ
โดย bankjittapol ส 09 พ.ย. 2019 11:54 am บอร์ด JavaScript & Jquery Ajax
3
59
จ 11 พ.ย. 2019 2:54 pm โดย tsukasaz
ไปรษณีย์ไทยเอาใจ e-commerce ด้วยบริการ ePacket
โดย numtan5839 ส 09 พ.ย. 2019 11:21 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
68
ส 09 พ.ย. 2019 11:21 am โดย numtan5839
งานประจำวันที่ 9 พฤศจิกายน 2562
โดย numtan5839 ส 09 พ.ย. 2019 10:13 am บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
4
28
ส 09 พ.ย. 2019 5:51 pm โดย numtan5839
ส่งค่า value โดยใช้ ajax เพื่อ select php
โดย bankjittapol ศ 08 พ.ย. 2019 5:54 pm บอร์ด Jquery & Ajax Knowledge
0
44
ศ 08 พ.ย. 2019 5:54 pm โดย bankjittapol
ขอสเตทเม้นของกรุงเทพยังใงคะ
โดย ฟ้าลดา ใจงาม ศ 08 พ.ย. 2019 5:40 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
2
63
ศ 08 พ.ย. 2019 6:17 pm โดย mindphp
สกุลเงินที่นิยมที่สุดในตลาด Forex
โดย numtan5839 ศ 08 พ.ย. 2019 4:46 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
36
ศ 08 พ.ย. 2019 4:46 pm โดย numtan5839
ทำความรู้จักกับ Forex ตลาดแลกเปลี่ยนเงินตราต่างประเทศ
โดย numtan5839 ศ 08 พ.ย. 2019 4:03 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
35
ศ 08 พ.ย. 2019 4:03 pm โดย numtan5839
ต้องการ ให้ ajax เปลี่ยน css ใน div
โดย bankjittapol ศ 08 พ.ย. 2019 3:26 pm บอร์ด JavaScript & Jquery Ajax
3
44
ศ 08 พ.ย. 2019 4:03 pm โดย tsukasaz
พรีฯของจากจีนมาขาย สั่งเองไม่ยาก ไม่เก่งภาษาจีนก็ทำได้!
โดย promotion ศ 08 พ.ย. 2019 3:06 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
32
ศ 08 พ.ย. 2019 5:13 pm โดย aloha11x