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

 

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
Block IP เข้าเว็บ เซิร์ฟเวอร์ เป็นข่วง ด้วย .htaccess
โดย mindphp ส 07 ธ.ค. 2019 2:12 pm บอร์ด Linux - Web Server
2
1429
อ 08 ธ.ค. 2019 11:17 am โดย mindphp
ภาพประกอบ Extensions
โดย numtan5839 ส 07 ธ.ค. 2019 11:19 am บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
0
3
ส 07 ธ.ค. 2019 11:19 am โดย numtan5839
งานประจำวันที่ 7 ธันวาคม 2562
โดย numtan5839 ส 07 ธ.ค. 2019 10:15 am บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
3
11
ส 07 ธ.ค. 2019 7:02 pm โดย numtan5839
งานประจำวันที่ 7 ธันวาคม 2562
โดย Grammanano ส 07 ธ.ค. 2019 10:05 am บอร์ด M098 - อนงค์นาท ไฝขาว
6
32
อ 08 ธ.ค. 2019 4:40 pm โดย mindphp
คำว่า extension ผิดค่ะ
โดย numtan5839 ศ 06 ธ.ค. 2019 8:17 pm บอร์ด MindPHP News & Feedback
1
28
ส 07 ธ.ค. 2019 1:20 am โดย mindphp
ทำอย่างไรให้ google slide นั้นสามารถแสดงหน้าที่เรากำหนดได้ ผ่าน url ครับ
โดย jamepiyawat ศ 06 ธ.ค. 2019 5:23 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
2
1623
จ 09 ธ.ค. 2019 10:17 am โดย jamepiyawat
การทำนายข้อมูลแบบ Dicision Tree ด้วยโปรแกรม Weka
โดย Grammanano ศ 06 ธ.ค. 2019 5:16 pm บอร์ด Share Knowledge
0
19
ศ 06 ธ.ค. 2019 5:16 pm โดย Grammanano
ทำไม แปลงวันเดือนปีเป็นวันที่ ตามระบบของ Joomla แล้ววันถึงถอยไปวันหนึ่งครับ
โดย jamepiyawat ศ 06 ธ.ค. 2019 3:23 pm บอร์ด Joomla Development
1
26
ศ 06 ธ.ค. 2019 4:51 pm โดย thatsawan
คำสั่งพื้นฐานในการใช้ Matlab เพื่อการทำ Image Processing
โดย Grammanano ศ 06 ธ.ค. 2019 3:20 pm บอร์ด Share Knowledge
0
1435
ศ 06 ธ.ค. 2019 3:20 pm โดย Grammanano
Introducing the Module Weather Forcecast.
โดย numtan5839 ศ 06 ธ.ค. 2019 2:34 pm บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
3
14
ส 07 ธ.ค. 2019 3:25 pm โดย numtan5839
เขียนบทความ แต่พอ save แล้วเนื้อหาไม่แสดง
โดย numtan5839 ศ 06 ธ.ค. 2019 2:30 pm บอร์ด MindPHP News & Feedback
0
19
ศ 06 ธ.ค. 2019 2:30 pm โดย numtan5839
จะทำอย่างไรให้ดึงข้อความ 10 ตัวท้ายได้ครับ
โดย jamepiyawat ศ 06 ธ.ค. 2019 11:39 am บอร์ด Programming - PHP
3
1435
ศ 06 ธ.ค. 2019 2:04 pm โดย jamepiyawat
จะทำอย่างไรให้ Plugin Content Change Log แสดงข้อความด้านบนได้ ครับ
โดย jamepiyawat ศ 06 ธ.ค. 2019 11:03 am บอร์ด Joomla Development
1
1430
ศ 06 ธ.ค. 2019 7:42 pm โดย thatsawan
งานประจำวันที่ 6 ธันวาคม 2562
โดย Grammanano ศ 06 ธ.ค. 2019 9:43 am บอร์ด M098 - อนงค์นาท ไฝขาว
5
33
ส 07 ธ.ค. 2019 6:59 pm โดย Grammanano
งานประจำวันที่ 6 ธันวาคม 2562
โดย numtan5839 ศ 06 ธ.ค. 2019 9:34 am บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
10
35
ศ 06 ธ.ค. 2019 7:42 pm โดย numtan5839
เปิดตัวเว็บบอร์ด รูปแบบใหม่ ของเรา มีอะไรมาใหม่ ลองมาดูกัน เราใช้ phpBB 3.2 นะ
โดย mindphp พ 04 ธ.ค. 2019 7:44 pm บอร์ด MindPHP News & Feedback
1
1447
พ 04 ธ.ค. 2019 8:03 pm โดย thatsawan
วิธีการ ใช้งาน Jquery คำนวณเลขฐาน 2 8 16
โดย Ittichai_chupol พ 04 ธ.ค. 2019 6:58 pm บอร์ด Jquery & Ajax Knowledge
0
956
พ 04 ธ.ค. 2019 6:58 pm โดย Ittichai_chupol
การใช้บอร์ด Arduino ต่อกับเซ็นเซอร์สี TCS3200
โดย Grammanano พ 04 ธ.ค. 2019 6:54 pm บอร์ด Share Knowledge
0
20
พ 04 ธ.ค. 2019 6:54 pm โดย Grammanano
คำสั่ง cmd และโปรแกรมที่ใช้สำหรับการเขียน python
โดย Grammanano พ 04 ธ.ค. 2019 6:02 pm บอร์ด M098 - อนงค์นาท ไฝขาว
5
33
ส 07 ธ.ค. 2019 4:52 pm โดย Grammanano
Google One เปิดสำรองข้อมูลบนระบบ Android
โดย noppadonsk พ 04 ธ.ค. 2019 5:42 pm บอร์ด Share Knowledge
0
23
พ 04 ธ.ค. 2019 5:42 pm โดย noppadonsk