我正在为一个网站项目使用 bootstrap 3。我正在尝试创建一个带有响应表的页面,这样当表太大时我就会有滚动条。我做了一个这样的测试用例:
<div class="row">
<h4>Nuværende kurser</h4>
<div class="col-12 col-sm-12 col-lg-12">
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th>#</th>
<th>Table heading</th>
<th>Table heading</th>
<th>Table heading</th>
<th>Table heading</th>
<th>Table heading</th>
<th>Table heading</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
</tr>
<tr>
<td>2</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
</tr>
<tr>
<td>3</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
</tr>
</tbody>
</table>
</div>
</div><!-- end col-12 -->
</div><!-- end row -->
现在,问题是它没有添加滚动条,它只是将网站扩展到表格的宽度。
请看这里的截图:
我已经看到它在其他几个网站上运行,所以我正在做的事情......是错误的。
最佳答案
用这个替换你的表格响应
<div class='table-responsive'> -> <div style="overflow-x:auto;">
关于html - Bootstrap 3 表 - 表响应不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26394072/