Question

我对表格html有问题（使用引导程序）

我有带行数的表。在每行的最后一个单元格中，我想添加水平滚动条。

我上传了html页面，因此您可以了解我的意思- http://77.247.180.36/~pelegisr/sites/tours/res-org2.html

如您所见，我有一个名为“ Nights”的灰色列，其中包含许多小表。我想在每行中添加X滚动，以便可以看到所有的商场蓝色表。

我尝试添加样式：“ display: inline-block; overflow-x:scroll; white-space: nowrap;”，但没有任何运气...

Answer 1

启用水平滚动。如果表格太大而无法容纳特定的布局，或者表格中有大量列，则可以启用水平（x）滚动以在视口中显示表格，该表格可以滚动。

此属性可以为true，这将允许表在需要时（推荐），任何CSS单位或数字（在这种情况下，将被视为像素尺寸）水平滚动

  $('#example').dataTable( {
  "scrollX": true
} );

您还可以检查Add horizontal scrollbar to html table是否有替代解决方案

Answer 2

要在表格单元格中添加滚动条，您可以执行以下操作：

<table border="1" style="table-layout:fixed; width:500px">
  <tr>
    <td style="width:100px;"><div style="overflow:scroll; width:100%">10000000000000000000000000000000000</div></td>
    <td>200</td>
    <td>300</td>
  </tr>
</table>

向表格单元格添加水平滚动条

2 个答案: