css如何让俩个表头一起浮动

CSS可以通过position属性中的fixed实现浮动效果。但是如果要让俩个表头一起浮动，则需要一些特殊的技巧。

首先，我们需要定义俩个table元素，第一个用于显示表头，第二个用于展示内容。

  <table id="thead">
    <thead>
      <tr>
        <th>标题1</th>
        <th>标题2</th>
        <th>标题3</th>
      </tr>
    </thead>
  </table>

  <table id="tbody">
    <tbody>
      <tr>
        <td>内容1</td>
        <td>内容2</td>
        <td>内容3</td>
      </tr>
    </tbody>
  </table>

然后，我们需要将第一个table元素（显示表头）的position属性设置为fixed，并同时设置z-index属性为1。这样就能保证表头始终浮动不被覆盖。

  #thead {
    position: fixed;
    z-index: 1;
  }

接着，我们需要将第二个table元素（展示内容）set margin-top为第一个table的高度。这就会让内容正好从表头下面开始展示，与其保持对齐。

  #tbody {
    margin-top: 50px;
  }

最后，为了在页面滚动时保持俩个表头一起浮动，我们需要添加一个scroll事件监听器。

  $(window).on('scroll',function () {
    var scrollTop = $(window).scrollTop();
    $('#thead').css('top',scrollTop + 'px');
  });

通过以上步骤，我们就能成功让俩个表头一起浮动了。