html - 具有可滚动主体和 colgroup 的表格不起作用

Question

我想通过 colgroup 定义列的宽度。此外，tbody 应该是可滚动的。但这是行不通的。有没有不用js的解决方案？

js fiddle

HTML

     <colgroup>
      <col span="1" style="width: 15%;">
      <col span="1" style="width: 40%;">
      <col span="1" style="width: 20%;">
      <col span="1" style="width: 25%;">
    </colgroup>

Answer 1

添加到你的CSS:

td:nth-child(1), th:nth-child(1) {
  width: 15%;
}
td:nth-child(2), th:nth-child(2) {
  width: 40%;
}
td:nth-child(3), th:nth-child(3) {
  width: 20%;
}
td:nth-child(4), th:nth-child(4) {
  width: 25%;
}

tbody 滚动在 chrome 中工作正常。不知道其他浏览器怎么样