使用Bootstrap 3固定高度，标题和列宽的表格

Question

我想要一张包含以下功能的表格：

• 固定标题，
• 固定高度（带可见滚动条）
• 3个固定宽度的柱子（一个大柱子和两个窄柱子）。

我开始使用：

tbody { display:block; overflow:auto; height:100px; }

要获得至少固定高度，但此规则会挤压左侧的表格（如有必要，我会提供屏幕截图）。

该表包含在Bootstrap 3列中。

以下是http://jsfiddle.net/PGEdK/

的示例

有什么想法吗？提前谢谢。

Answer 1

这是JS FIDDLE DEMO，它正如您所期望的那样工作。实际上，你的tbody风格没有问题。您只需为 和 td 添加更多样式。所以，你的最终代码将是这样的：

tr {display: block; }
th, td { width: 300px; }
tbody { display: block; height: 100px; overflow: auto;} 

如果你看小提琴，你会注意到我用 tr 包裹了 ，这样我就可以在显示后给出适当的宽度：块样式为的 TR 即可。所以，如果你想定位只包裹th的tr，你也可以这样做。

出于演示目的，我使用.tablecontainer类包装了表，以便我们可以使用一定的宽度。

Answer 2

尝试max-height和max-width ..设置最大高度和宽度