Html 引导表上的滚动条

我有一个

表格

，它在

面板

中呈现，面板位于

模式

中。由于表相对较大，我想将它的行限制为5，这样模式就不会变成可滚动的。我浏览了SO和google，看到的每一个地方都需要设置

overflow-y:auto

或

overflow-y:scroll

，以使其工作，但在我的情况下，它不能工作。我还设置了一个400px的随机高度和位置：绝对。这使得表格可以滚动，但现在面板将关闭，并在面板外部呈现表格主体。这有什么办法

我的代码片段是：

<div class="modal fade">
   <div class="modal-dialog " >
      <div class="modal-content">
         <div class="modal-body">
            <div class="panel panel-default">
               <div class="panel-body">
                  <table class="table table-bordered>
                     <thead>
                         [........]
                     </thead>
                     <tbody style="overflow-y:auto; height:400px; position:absolute>
                     [.......]
                     </tbody>
                   </table>

[.......]

[…其余的

s..]

---

编辑

---

谢谢你的回复。有没有办法将滚动条缩小到

，使

保持静态？

我给您举了一个例子，请尝试一下

表格，tr，th，td{
边框：1px实心#dddddd；
边界塌陷：塌陷；
}
.tbl标题{
宽度：计算（100%-17px）；
宽度：-webkit计算（100%-17px）；
宽度：-moz计算（100%-17px）；
}

1.
2.
德萨达
达达斯
德萨达
达达斯
德萨达
达达斯
德萨达
达达斯
德萨达
达达斯
德萨达
达达斯

将其包装在

表格中

并设置最大高度：

.table-responsive {
    max-height:300px;
}

这是演示

#折叠1{
溢出y：滚动；
高度：200px；

带表的可折叠列表
名字
姓氏
电子邮件
约翰
雌鹿
john@example.com
约翰
雌鹿
john@example.com
约翰
雌鹿
john@example.com
约翰
雌鹿
john@example.com
约翰
雌鹿
john@example.com
约翰
雌鹿
john@example.com
约翰
雌鹿
john@example.com
玛丽
教育部
mary@example.com
七月
杜利
july@example.com

相反，将样式放在div上，类面板主体为overflow-y:scroll；height:200px；请参见下面的答案中的演示。您的源代码中的table类是否也缺少结束引号，或者这只是在问题中删减代码的产物。我签出了您共享的代码。这似乎为整个pa添加了一个滚动条nel.我希望它只适用于表格。将

表格响应

从面板移动到

似乎不起作用。我们不想滚动表格标题。我打算实现这一点，因为这是我见过的规避当前问题的最干净的方法。我试着在身体静止时保持标题静止由于可滚动，但遇到了大小调整问题。我接受这个答案。如果我找到更好的方法，我会在这里发布答案。感谢@ZimSystemIf其他人登陆这里希望水平滚动注意：“通过将any.table in.table responsible包装来创建响应表，使它们在小型设备上水平滚动（在768px下）。当查看任何大于768px宽的对象时，您将不会在这些表中看到任何差异。”很好。所以你的方法基本上是有两个表，一个表示

，另一个表示

。我来试一试，看看这是否可行。不过，我还是希望它们是一个单独的表！谢谢Anil。有什么方法可以使

保持静态？你可以将样式位置设置为固定或静态。