Các lớp theo ngữ cảnh có thể được sử dụng để tô màu toàn bộ bảng [______24Blue. Biểu thị một hành động quan trọng
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
50Xanh lục. Cho biết một hành động thành công hoặc tích cực
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
51Màu đỏ. Biểu thị một hành động nguy hiểm hoặc có khả năng tiêu cực
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
52Xanh dương nhạt. Biểu thị một thay đổi hoặc hành động mang tính thông tin trung lập
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
53Cam. Biểu thị cảnh báo có thể cần chú ý
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
54Grey. Áp dụng màu di chuột cho hàng của bảng hoặc ô của bảng
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
55Grey. Biểu thị một hành động ít quan trọng hơn một chút
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
56Nền bảng hoặc hàng của bảng màu xám nhạt
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
2Nền của bảng hoặc hàng của bảng màu xám đậmMàu đầu bảng
Lớp
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
58 thêm nền đen vào tiêu đề bảng và lớp
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
59 thêm nền xám vào tiêu đề bảngThí dụ
FirstnameLastnameEmailJohnDoejohn@example. comMaryMoemary@example. com JulyDooleyjuly@example. comFirstnameLastnameEmailJohnDoejohn@example. comMaryMoemary@example. com JulyDooleyjuly@example. com
Tương tự như bảng mặc định và bảng nghịch đảo, hãy sử dụng một trong hai lớp bổ trợ để làm cho s có màu xám nhạt hoặc đậm
#First NameLast NameUsername1MarkOtto@mdo2JacobThornton@fat3Larrythe Bird@twitter#First NameLast NameUsername1MarkOtto@mdo2JacobThornton@fat3Larrythe Bird@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
hàng sọc
Sử dụng
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
7 để thêm sọc vằn vào bất kỳ hàng nào của bảng trong#First NameLast NameUsername1MarkOtto@mdo2JacobThornton@fat3Larrythe Bird@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
#First NameLast NameUsername1MarkOtto@mdo2JacobThornton@fat3Larrythe Bird@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
bảng có viền
Thêm
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
8 cho đường viền trên tất cả các mặt của bảng và ô#First NameLast NameUsername1MarkOtto@mdo2MarkOtto@TwBootstrap3JacobThornton@fat4Larry the Bird@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Mark
Otto
@TwBootstrap
3
Jacob
Thornton
@fat
4
Larry the Bird
@twitter
#First NameLast NameUsername1MarkOtto@mdo2MarkOtto@TwBootstrap3JacobThornton@fat4Larry the Bird@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Mark
Otto
@TwBootstrap
3
Jacob
Thornton
@fat
4
Larry the Bird
@twitter
Hàng có thể di chuột
Thêm
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
9 để kích hoạt trạng thái di chuột trên các hàng của bảng trong một#First NameLast NameUsername1MarkOtto@mdo2JacobThornton@fat3Larry the Bird@twitter
________số 8
#First NameLast NameUsername1MarkOtto@mdo2JacobThornton@fat3Larry the Bird@twitter
________số 8
Bàn nhỏ
Thêm
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
0 để làm cho các bảng nhỏ gọn hơn bằng cách cắt đôi phần đệm ô#First NameLast NameUsername1MarkOtto@mdo2JacobThornton@fat3Larry the Bird@twitter
________số 8
#First NameLast NameUsername1MarkOtto@mdo2JacobThornton@fat3Larry the Bird@twitter
________số 8
các lớp theo ngữ cảnh
Sử dụng các lớp theo ngữ cảnh để tô màu các hàng của bảng hoặc các ô riêng lẻ
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
1Áp dụng màu di chuột cho một hàng hoặc ô cụ thể
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
2Cho biết một hành động thành công hoặc tích cực
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
3Cho biết một hành động hoặc thay đổi thông tin trung lập
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
4Cho biết một cảnh báo có thể cần chú ý
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
5Cho biết một hành động nguy hiểm hoặc có khả năng tiêu cực#Tiêu đề cộtTiêu đề cộtTiêu đề cột1Nội dung cộtNội dung cộtNội dung cột2Nội dung cộtNội dung cộtNội dung cột3Nội dung cộtNội dung cộtNội dung cột4Nội dung cộtNội dung cột5Nội dung cộtNội dung cột9Nội dung cột6Nội dung cộtNội dung cột7Nội dung cộtNội dung cột8Nội dung cộtNội dung cột9Nội dung cộtNội dung cột
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
1Các biến thể nền của bảng thông thường không khả dụng với bảng nghịch đảo, tuy nhiên, bạn có thể sử dụng các tiện ích nền hoặc văn bản để đạt được các kiểu tương tự
#Tiêu đề cộtTiêu đề cộtTiêu đề cột1Nội dung cộtNội dung cộtNội dung cột2Nội dung cộtNội dung cộtNội dung cột3Nội dung cộtNội dung cộtNội dung cột4Nội dung cộtNội dung cột5Nội dung cộtNội dung cột9Nội dung cột6Nội dung cộtNội dung cột7Nội dung cộtNội dung cột8Nội dung cộtNội dung cột9Nội dung cộtNội dung cột
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
1Truyền đạt ý nghĩa cho các công nghệ hỗ trợ
Việc sử dụng màu sắc để thêm ý nghĩa chỉ cung cấp dấu hiệu trực quan, dấu hiệu này sẽ không được chuyển tải đến người dùng công nghệ hỗ trợ – chẳng hạn như trình đọc màn hình. Đảm bảo rằng thông tin được biểu thị bằng màu sắc rõ ràng từ chính nội dung [e. g. văn bản hiển thị], hoặc được bao gồm thông qua các phương tiện thay thế, chẳng hạn như văn bản bổ sung ẩn với lớp
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
6bảng đáp ứng
Tạo các bảng đáp ứng bằng cách thêm
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
7 vào bất kỳ
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
4 nào để làm cho chúng 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ì rộng hơn 768px, bạn sẽ không thấy bất kỳ sự khác biệt nào trong các bảng nàyCác bảng đáp ứng sử dụng
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
#
First Name
Last Name
Username
1
Mark
Otto
@mdo
2
Jacob
Thornton
@fat
3
Larry
the Bird
@twitter
9, loại bỏ bất kỳ nội dung nào nằm ngoài các cạnh dưới cùng hoặc trên cùng của bảng. Đặc biệt, điều này có thể loại bỏ các menu thả xuống và các tiện ích con của bên thứ ba khác#Table headingTiêu đề bảngTiêu đề bảngTiêu đề bảngTiêu đề bảngTiêu đề bảngTiêu đề bảng1Table cellTable cellTable cellTable cellTable cellTable cell2Table cellTable cellTable cellTable cellTable cell3Table cellTable cellTable cellTable cellTable cell#Table headerTiêu đề bảngTiêu đề bảngTiêu đề bảngTiêu đề bảngTiêu đề bảng1Table cellTable cellTable cellTable cell2Table cellTable cellTable cellTable cellTable cellTable cell3Table cellTable cellTable cell