【表格标签】 |
|
<table> |
定义一个表格 |
<thead> |
表格表头 |
<tbody> |
表格主体内容 |
<tr> |
行 |
<th> |
表头列 |
<td> |
单元格 |
<caption> |
表格标题 |
【table样式】 |
|
.table |
基类,以下样式均应用于<table... |
.table-striped |
定义条纹表格,示例:<table class="table table-striped"> |
.table-bordered |
定义带有边框的条件,示例: <table class="table table-bordered"> |
.table-hover |
为表格的每一行添加鼠标悬停效果(灰色背景),示例:<table class="table table-hover"> |
.table-dark |
定义黑色背景的表格,示例:<table class="table table-dark"> |
.table-responsive |
创建响应式表格:在屏幕宽度小于 992px 时会创建水平滚动条,如果可视区域宽度大于 992px 则显示不同效果(没有滚动条),示例: <table class="table table-responsive"> |
.table-responsive-{sm|md|lg|xl} |
定义在指定屏幕尺寸下响应式表格 |
.table-lg |
较大的表格,示例:<table class="table table-lg"> |
.table-sm |
较小的表格,示例:<table class="table table-sm"> |
【tr、thead样式】 |
|
.table-primary |
指定tr或thead行的颜色,下同 |
.table-success |
同上 |
.table-info |
同上 |
.table-danger |
同上 |
.table-warning |
同上 |
.table-active |
同上 |
.table-secondary |
同上 |
.table-light |
同上 |
.table-dark |
同上 |