ให้เรตสมาชิก: 3 / 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> กำหนดคำอธิบายของแต่ละข้อมูล

 

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
งานประจำวันที่ 19 สิงหาคม 2562
โดย chatee supasand จ 19 ส.ค. 2019 10:03 am บอร์ด MT33 - นายชาตรี สุภาแสน
2
10
จ 19 ส.ค. 2019 7:51 pm โดย chatee supasand
google เปลี่ยนดีไซน์หน้าค้นหาใหม่ในสมาร์ทโฟนและแสดงไอคอนของเว็บไซต์ได้
โดย jamepiyawat จ 19 ส.ค. 2019 6:33 pm บอร์ด Share Knowledge
0
28
จ 19 ส.ค. 2019 6:33 pm โดย jamepiyawat
Windows 10 เตรียมอัพฟีเจอร์เช็คความร้อนของ GPU โดยไม่ต้องง้อโปรแกรมเสริมได้แล้วใน Build 18963
โดย chatee supasand จ 19 ส.ค. 2019 6:23 pm บอร์ด Microsoft Office Knowledge & line & Etc
0
22
จ 19 ส.ค. 2019 6:23 pm โดย chatee supasand
อยากทราบวิธีการคำนวนจำนวนบรรทัด ใน google sheet
โดย Ittichai_chupol จ 19 ส.ค. 2019 4:19 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
0
17
จ 19 ส.ค. 2019 4:19 pm โดย Ittichai_chupol
การเสนอราคาสมาคมสโมสรนักลงทุน
โดย EyePornnipa จ 19 ส.ค. 2019 2:59 pm บอร์ด M089 - นางสาวพรนิภา ราชธานี
1
20
อ 20 ส.ค. 2019 11:50 am โดย EyePornnipa
สอบถาม wkhtmltopdf ตอนแปลงไฟล์ pdf แล้ว graph ใน javascript ไม่มาด้วย มีวิธีแก้ไขไหมครับ
โดย jirawoot จ 19 ส.ค. 2019 2:53 pm บอร์ด Programming - C/C++ & java & Python
0
17
จ 19 ส.ค. 2019 2:53 pm โดย jirawoot
สอบถาม วิธีการนับเวลาในไฟล์วีดีโอครับ
โดย jirawoot จ 19 ส.ค. 2019 11:34 am บอร์ด Programming - C/C++ & java & Python
1
31
จ 19 ส.ค. 2019 5:07 pm โดย jirawoot
งานประจำวันที่ 19 สิงหาคม 2562
โดย EyePornnipa จ 19 ส.ค. 2019 10:15 am บอร์ด M089 - นางสาวพรนิภา ราชธานี
3
22
จ 19 ส.ค. 2019 7:33 pm โดย EyePornnipa
งานประจำวันที่ 19 กรกฎาคม 2562
โดย jamepiyawat จ 19 ส.ค. 2019 10:09 am บอร์ด M084 - นายปิยวัช เชาว์วิมล
1
5
จ 19 ส.ค. 2019 7:56 pm โดย jamepiyawat
งานประจำวันที่ 19 สิงหาคม 2562
โดย jirawoot จ 19 ส.ค. 2019 10:01 am บอร์ด M090 - นายจิระวุฒิ อัครลิขิตกุล
2
11
อ 20 ส.ค. 2019 10:06 am โดย jirawoot
สอบถามเกี่ยวกับการ บวก ลบ ใน Tuple ทำยังไงครับ ภาษา Python
โดย fuyuppe อ 18 ส.ค. 2019 3:20 pm บอร์ด Programming - C/C++ & java & Python
0
33
อ 18 ส.ค. 2019 3:20 pm โดย fuyuppe
น้องเมย์ค่ะ
โดย frenchfriesday อ 18 ส.ค. 2019 1:14 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
38
อ 18 ส.ค. 2019 1:14 pm โดย frenchfriesday
หลักการ วิธีการทำเว็บไซต์แสดงได้หลายภาษา ด้วย PHP เขียนเว็บสองภาษา
โดย jamepiyawat ส 17 ส.ค. 2019 10:17 pm บอร์ด PHP Knowledge
0
66
ส 17 ส.ค. 2019 10:17 pm โดย jamepiyawat
ขอคำแนะนำ เว็บไซด์ค่ะ
โดย Luckluck ส 17 ส.ค. 2019 8:35 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS CRM
1
46
ส 17 ส.ค. 2019 8:40 pm โดย mindphp
Joomla website
โดย Luckluck ส 17 ส.ค. 2019 8:17 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS CRM
1
25
ส 17 ส.ค. 2019 8:37 pm โดย mindphp
Socratic แอปช่วยทำการบ้านและค้นหาบทเรียน
โดย jamepiyawat ส 17 ส.ค. 2019 5:56 pm บอร์ด Share Knowledge
0
33
ส 17 ส.ค. 2019 5:56 pm โดย jamepiyawat
สอบถามการใช้อัตราแลกเปลี่ยนในการบันทึกเจ้าหนี้ต่างประเทศ
โดย EyePornnipa ส 17 ส.ค. 2019 4:06 pm บอร์ด ถาม - ตอบ ธุรกิจ กฏหมาย ภาษี บัญชี
2
33
ส 17 ส.ค. 2019 4:09 pm โดย EyePornnipa
คำสั่งนี้คืออะไรครับ เหมือน short if หรือเปล่าครับ
โดย jamepiyawat ส 17 ส.ค. 2019 2:22 pm บอร์ด Programming - PHP
4
53
ส 17 ส.ค. 2019 3:40 pm โดย jamepiyawat
การลงทะเบียนผู้ค้ากับภาครัฐในระบบ e-GP
โดย EyePornnipa ส 17 ส.ค. 2019 1:53 pm บอร์ด M089 - นางสาวพรนิภา ราชธานี
0
18
ส 17 ส.ค. 2019 1:53 pm โดย EyePornnipa
หากจ่ายชำระค่าโทรศัพท์เกิน ควรบันทึกบัญชียังไง
โดย EyePornnipa ศ 16 ส.ค. 2019 12:10 pm บอร์ด ถาม - ตอบ ธุรกิจ กฏหมาย ภาษี บัญชี
1
43
ส 17 ส.ค. 2019 11:06 am โดย Amp_Audit