web开发中常常需要添加表格或者列表元素,但是如果元素内容过多就会占用太大的页面空间,不方便排版,所以滚动条的添加很重要。
<div class="col-md-6" style="margin: 0">
<!--<div class="row pre-scrollable">-->
<table class="table table-hover">
<thead>
<tr>
<th>词语</th>
<th>数量</th>
</tr>
</thead>
<tbody>
<tr>
<td>啊啊啊啊啊</td>
<td>10</td>
</tr>
<tr>
<td>啊啊啊啊啊</td>
<td>10</td>
</tr>
<tr>
<td>啊啊啊啊啊</td>
<td>10</td>
</tr>
<tr>
<td>啊啊啊啊啊</td>
<td>10</td>
</tr><tr>
<td>啊啊啊啊啊</td>
<td>10</td>
</tr><tr>
<td>啊啊啊啊啊</td>
<td>10</td>
</tr>
<tr>
<td>啊啊啊啊啊</td>
<td>10</td>
</tr>
<tr>
<td>啊啊啊啊啊</td>
<td>10</td>
</tr>
<tr>
<td>啊啊啊啊啊</td>
<td>10</td>
</tr>
<tr>
<td>啊啊啊啊啊</td>
<td>10</td>
</tr>
</tbody>
</table>
<!--</div>-->
</div>
以上这段代码的效果图为
如果将上述代码中的注释解开,即加上了
<div class="row pre-scrollable">
</div>
效果图就变成了这样
这样滚动条便添加成功了。