Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> CSS

Các mục danh sách Inline trong CSS là gì?

Sử dụng các mục danh sách Inline để xây dựng thanh điều hướng ngang. Đặt các phần tử <li> thành inline.

Ví dụ

Bạn có thể chạy mã sau để tạo thanh điều hướng ngang:

<!DOCTYPE html>
<html>
  <head>
    <style>
      ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
      }
      .active {
        background-color: #4CAF50;
        color: white;
      }
      li {
        border-bottom: 1px solid #555;
        display: inline;
      }
    </style>
  </head>
  <body>
    <ul>
      <li><a href="#home">Trang chủ</a></li>
      <li><a href="#company" class="active">Công ty</a></li>
      <li><a href="#product">Sản phẩm</a></li>
      <li><a href="#services">Dịch vụ</a></li>
      <li><a href="#contact">Liên hệ</a></li>
    </ul>
  </body>
</html>