Question

我正在尝试创建一个带有标题的表格，该标题固定在页面顶部，因为用户滚动表格标题仍然显示在页面顶部。但表格标题的宽度与表格的宽度不同。这是一个例子：

<html>
<head>
  <style type="text/css" media="screen">
  thead
  {
    position: fixed;
    top: 0;
  }
  </style>

  </head>

  <body>
    <table border="1" cellspacing="5" cellpadding="5">
      <thead>
        <tr>
          <th>Heading 1</th>
          <th>Heading 2</th>
          <th>Heading 3</th>
          <th>Heading 4</th>
          </tr>
          </thead>
          <tr>
            <td>c1</td>
            <td>c2</td>
            <td>c3</td>
            <td>c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4c4</td>
            </tr>
      </table>
  </body>
</html>

如何让我的标题与表格的宽度相同？

JSFiddle

Answer 1

请在完成此thead标记后添加tbody标记并删除位置：已在thead class css中修复

页面顶部的表格标题，而可滚动的表格内容与表格

1 个答案: