html table 首列固定

要实现HTML表格中首列固定，我们可以使用CSS和JavaScript来实现。具体的方法如下：

1. 首先，在HTML文件中创建一个表格，并将其放置在一个具有固定高度和宽度的父容器内。表格的第一列将成为我们要固定的列。

2. 使用CSS将表格设置为固定布局，并将父容器设置为相对定位。

<style>
  #container {
    position: relative;
    height: 300px; /* 设置固定高度 */
    overflow: auto;
  }
  
  table {
    table-layout: fixed;
  }
</style>

<div id="container">
  <table>
    <!-- 表格的内容 -->
  </table>
</div>

3. 接下来，使用JavaScript获取表格的第一列，并将其进行固定定位。同时，将内容滚动时对应的左边距设置为滚动位置。

<script>
  window.onload = function() {
    var table = document.querySelector('table');
    var firstColumn = table.getElementsByTagName('td')[0]; // 获取第一列
    
    table.style.marginLeft = -firstColumn.offsetLeft + 'px'; // 设置左边距为第一列的位置
    
    // 监听内容的滚动事件
    document.getElementById('container').addEventListener('scroll', function() {
      table.style.marginLeft = -firstColumn.offsetLeft + 'px'; // 设置左边距为滚动位置
    });
  };
</script>

通过以上步骤，我们就可以实现HTML表格中首列固定的效果。当我们在父容器内滚动内容时，第一列将保持在固定位置，并能够与表格的其他部分对应。