Html 带有滚动和最小化选项的css表格设计代码

实际上，我正在寻找具有滚动选项的html表，以及最小化和最大化表（以及更好的表设计）的选项。我花了好几个小时试图解决这个问题，但却一无所获。你能在网上给我一些可以解决这个问题的代码吗？ 我会很感激你吗

---

jsfiddle:

您正在寻找类似的产品吗

滚动表格：

可折叠表格：

---

我建议你把桌子放在一个div里

试试这个&让我知道

<span onlcick="ShowHide('tblContainer')">Show/Hide</span>
<div id="tblContainer" style="clear:both;max-height:300px;overflow-y:scroll;">
  <table....>
      <define your rows and columns...>
  </table>
</div>

---

您不能仅使用CSS最小化表。您还需要一些JavaScript。感谢第一个链接中的回复（）我想在表标记中使用多个tbody标记，如单元格内容1单元格内容2单元格内容3更多单元格内容1更多单元格内容2更多单元格内容3，但无法获得所需的结果，为了支持多个tbody部分，我应该在css中做些什么改变。你试过了吗？CSS中没有任何东西可以阻止多个tbody元素。是的，我尝试了这个，但是它只显示了第一个

code

code

标记的行。第二个

code

code

标记中的行未显示。实际上，我正在创建两个tbody标记，在第一个tbody中，我们将有一行，其余所有行将显示在第二个tbody标记中。因此，我正在设置css中

code

tbody.scrollContent

code

部分的高度。但是无法获得所需的结果，您能告诉我哪里出错了吗？您需要相应地调整最大高度

function ShowHide(id) { $("#" + id).toggle(); }