Question

我正在尝试使用带有Angularjs框架的HTML + Bootstrap CSS创建一个表，如果表数据到达行的末尾，则创建一个水平滚动条。每行应该恰好占用1行。我该怎么做？

如果我将css样式添加到curdItem的td元素上并使用宽度和高度，我可以按照我想要的方式获取它，但这取决于屏幕大小。有没有办法满足任何大小的浏览器窗口？ style="width:200px; height: 50px;display: block; overflow-x: scroll;

<table class="table table-striped">
  <tr ng-repeat="currItem in allItems">
      <td>{{currItem}}</td>
      <td><hr style="margin-top:5px;margin-bottom:5px"></td>
  </tr>
</table>

Answer 1

您不需要overflow-x只需将其设为overflow: scroll;。只需在td元素中执行此操作即可。此外，内容必须足够长以滚动元素。

Answer 2

通过反复试验找到答案......关键是白空：nowrap

        <td style="white-space: nowrap; overflow: scroll;">stuffhere</td>

使表格行可滚动CSS

2 个答案: