为table添加滚动条

时间:2023-01-26 22:48:56

说明:在table外加个div,然后再设置div和table的高度。最后,再给div加个overflow:scroll(横向滚动条为overflow-x:scroll;竖向滚动条为overflow-y:scroll)。

添加竖向滚动条代码示例:

<div class="tableDiv">
<table class="table table-bordered table-hover table-striped text-center">
<thead>
<tr>
<th>预约人</th>
<th>预约日期</th>
<th>预约时间</th>
<th>下车地点</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
.tableDiv{height:300px;overflow-y:scroll;}
页面效果展示:

为table添加滚动条为table添加滚动条