home

หน้าแรก
 Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

วิธีสร้างรายการไม่มีลำดับ (Unordered List) ไม่มี Bullet ใน HTML

ใช้ CSS property list-style-type: none ในแท็ก <ul> เพื่อซ่อน bullet เริ่มต้น

ตัวอย่าง

<!DOCTYPE html>
<html>
<head>
  <title>HTML Unordered List</title>
</head>
<body>
  <h1>Developed Countries</h1>
  <p>The list of developed countries:</p>
  <ul style="list-style-type:none">
    <li>US</li>
    <li>Australia</li>
    <li>New Zealand</li>
  </ul>
</body>
</html>

ผลลัพธ์

  • US
  • Australia
  • New Zealand

การประยุกต์ใช้

  • Navigation menu (แถบนำทาง)
  • รายการที่จัด layout ด้วย CSS เอง (flexbox/grid)
  • breadcrumb, pagination, tag clouds

แนวทางปฏิบัติที่ดี

.no-bullets {
  list-style-type: none;
  padding-left: 0; /* ลบ padding ซ้ายของ ul ด้วย */
  margin-left: 0;
}

แล้วใช้ <ul class="no-bullets">