หลังจากเรียนรู้แท็ก HTML จำนวนมากที่ควบคุมการแสดงหน้าเว็บหน้าผู้อ่านสามารถสร้างหน้าบทความบริสุทธิ์ได้ในขั้นต้น ส่วนนี้เรียนรู้องค์ประกอบรายการใน HTML รูปแบบรายการบัญชีสำหรับสัดส่วนที่ค่อนข้างใหญ่ของการออกแบบเว็บไซต์และข้อมูลการแสดงผลนั้นเรียบร้อยและใช้งานง่ายมากซึ่งเป็นเรื่องง่ายสำหรับผู้ใช้ที่จะเข้าใจ บทบาทขั้นสูงขององค์ประกอบรายการจะถูกนำมาใช้อย่างกว้างขวางในการเรียนรู้สไตล์ CSS ที่ตามมา
4.4.1 องค์ประกอบโครงสร้างของรายการองค์ประกอบรายการของ HTML เป็นโครงสร้างที่ล้อมรอบด้วยแท็กรายการและรายการรายการที่มีอยู่ประกอบด้วย <li> </li> โครงสร้างเฉพาะแสดงในรูปที่ 4.17
4.4.2 การสร้างรายการที่ไม่ได้เรียงลำดับตามชื่อแนะนำรายการที่ไม่ได้เรียงลำดับเป็นแบบฟอร์มรายการที่รายการรายการในโครงสร้างรายการไม่มีคำสั่งซื้อ เว็บแอปพลิเคชันส่วนใหญ่ใช้รายการที่ไม่ได้เรียงลำดับและแท็กรายการของพวกเขาคือ <ul> </ul> วิธีการเขียนมีดังนี้:
<ul>
<li> รายการรายการ 1 </li>
<li> รายการรายการ 2 </li>
<li> รายการรายการ 3 </li>
<li> รายการรายการ 4 </li>
<li> รายการรายการ 5 </li>
</ul>
4.4.3 ทำรายการที่สั่งซื้อตามชื่อแนะนำรายการที่สั่งซื้อหมายความว่ารายการรายการในโครงสร้างรายการมีลำดับของรายการ จากบนลงล่างอาจมีหมายเลขลำดับต่าง ๆ เช่น 1, 2, 3 หรือ A, B, C ฯลฯ สร้างไฟล์หน้าเว็บใน D:/ Web/ Directory ชื่อ UL_OL.htm และเขียนโค้ดตามที่แสดงในรหัส 4.17
รหัส 4.17 การตั้งค่ารายการ: ul_ol.htm
<html>
<head>
<title> รายการการตั้งค่า </title>
</head>
<body>
<font size = 5>
เทคโนโลยีแผนกต้อนรับเว็บ
<ul>
<li> html </li>
<li> CSS </li>
<li> JavaScript </li>
<li> แฟลช </li>
</ul>
การเรียนรู้ภูมิหลังของเว็บ
<ol>
<li> ASP </li>
<li> asp.net </li>
<li> php </li>
<li> CGI </li>
<li> ทับทิม </li>
<li> Python </li>
</ol>
</font>
</body>
</html>
ป้อน http: //localhost/ul_ol.htm ในแถบที่อยู่เบราว์เซอร์และเอฟเฟกต์การเรียกดูจะแสดงในรูปที่ 4.18
รูปที่ 4.18 การตั้งค่ารายการ