Cách tạo: danh sách nhóm

Học cách sử dụng CSS để chuyển đổi danh sách cơ bản thành "danh sách nhóm".

  • Adele
  • Agnes
  • Billy
  • Bob
  • Calvin
  • Christina
  • Cindy

Thử ngay

Cách tạo danh sách nhóm

Bước 1 - Thêm HTML:

ul
  <li>Adele</li>
  <li>Agnes</li>
  <li>Billy</li>
  <li>Bob</li>
  <li>Calvin</li>
  <li>Christina</li>
  <li>Cindy</li>
</ul>

Bước 2 - Thêm CSS:

ul {
  list-style-type: none; /* Loại bỏ dấu kiểm */
  padding: 0; /* Loại bỏ khoảng cách bên trong */
  margin: 0; /* Loại bỏ khoảng cách bên ngoài */
}
ul li {
  border: 1px solid #ddd; /* Thêm viền mỏng cho mỗi mục danh sách */
  margin-top: -1px; /* Tránh khung双边框 */
  background-color: #f6f6f6; /* Thêm màu nền xám */
  padding: 12px; /* Thêm một số khoảng cách trong
}

Thử ngay

Trang liên quan

Hướng dẫn:Danh sách CSS