Bootstrap4 表格

2020-06-19 08:31:02易采站长站整理
JohnDoejohn@example.comMaryMoemary@example.comJulyDooleyjuly@example.com
FirstnameLastnameEmail
JohnDoejohn@example.com
MaryMoemary@example.com
JulyDooleyjuly@example.com


较小的表格

.table-sm 类用于通过减少内边距来设置较小的表格:

实例

FirstnameLastnameEmail
JohnDoejohn@example.com
MaryMoemary@example.com
JulyDooleyjuly@example.com


响应式表格

.table-responsive 类用于创建响应式表格:在屏幕宽度小于 992px 时会创建水平滚动条,如果可视区域宽度大于 992px 则显示不同效果(没有滚动条):

实例

#FirstnameLastnameAgeCityCountrySexExampleExampleExampleExample
1AnnaPitt35New YorkUSAFemaleYesYesYesYes

你可以通过以下类设定在指定屏幕宽度下显示滚动条:

类名屏幕宽度
.table-responsive-sm< 576px
.table-responsive-md< 768px
.table-responsive-lg< 992px
.table-responsive-xl< 1200px

实例

...

相关文章 大家在看