Bảng khởi động

Bảng cơ bản Bootstrap

Bảng Bootstrap cơ bản có phần đệm nhẹ và chỉ có các ngăn ngang.

Lớp .table thêm kiểu dáng cơ bản vào bảng:

Hàng sọc

Lớp .table-striped thêm sọc ngựa vằn vào bảng:

Bảng có viền

Lớp .table-bordered thêm đường viền trên tất cả các cạnh của bảng và ô:

Hàng di chuột

Lớp .table-hover thêm hiệu ứng di chuột (màu nền xám) trên các hàng của bảng:

Bảng cô đọng

Lớp .table-condensed làm cho bảng nhỏ gọn hơn bằng cách cắt phần đệm ô làm đôi:

Lớp học theo ngữ cảnh

Các lớp theo ngữ cảnh có thể được sử dụng để tô màu các hàng trong bảng ( <tr> ) hoặc các ô trong bảng ( <td> ):

Các lớp ngữ cảnh có thể được sử dụng là:

Bảng đáp ứng

Lớp .table-responsive tạo ra một bảng phản hồi. Bảng sau đó sẽ cuộn theo chiều ngang trên các thiết bị nhỏ (dưới 768px). Khi xem trên bất kỳ thứ gì có chiều rộng lớn hơn 768px, không có sự khác biệt:

<bảng >
  <tr>
    <td>John</td>
    <td>Con nai</td>
    <td> [email được bảo vệ] </td>
  <tr>
  <tr>
    <td>Mary</td>
    <td>Moe</td>
    <td> [email được bảo vệ] </td>
  </tr>
  <tr>
    <td>Tháng 7</td>
    <td>Dooley</td>
    <td> [email được bảo vệ] </td>
  </tr>
<bàn>

Tham khảo bảng Bootstrap hoàn chỉnh

Để có tài liệu tham khảo đầy đủ về tất cả các lớp bảng, hãy truy cập Tài liệu tham khảo bảng Bootstrap đầy đủ của chúng tôi.