位置固定的html表格

我使用位置固定来冻结表中的第一列。如何使第一列布局（宽度和高度）与其他列相同，使其看起来与其他列相同，但处于冻结状态

<div>
 <table>
<tr>
  <th class='td1'>h1</th>
  <th>h2</th>
  <th>h3</th>
</tr>
<tr>
  <td class='td1'>D1</td>
  <td>D2</td>
  <td>D3</td>
</tr>
<tr>
  <td class='td1'>D1</td>
  <td>D2</td>
  <td>D3</td>
</tr>
</table>
</div>

你是说像这样吗

CSS:

HTML:

h1
氢
h3
D1
D2
D3
D1
D2
D3

试试下面的方法-

表格{
边界塌陷：分离；
边界间距：0；
边框顶部：1px纯色灰色；
宽度：300px；
高度：100px；
}
运输署，
th{
保证金：0；
边框：1px纯灰；
空白：nowrap；
边框顶部宽度：0px；
}
div{
宽度：200px；
溢出-x：滚动；
左侧边缘：5em；
溢出y：可见；
填充：0；
}
校长{
位置：绝对位置；
宽度：5em；
左：0；
顶部：自动；
边框顶部宽度：1px；
页边顶部：-1px；
}
上校：以前{
内容：“行”；
}
.朗{
背景：黄色；
}

h1
氢
h3
D1
D2
D3
D1
D2
D3

使用引导库

table {
  border-collapse: collapse;
  border: 1px solid black;
  width: 300px;
  height: 300px;
}

tr,
td,
th {
  border: 1px solid black;
  text-align: center;
}

.td1 {
  position: fixed;
  margin-top: 10px;
  margin-left: 10px;
}

div {
  width: 200px;
  height: 400px;
  overflow: auto;
}

table {
  border-collapse: collapse;
  border: 1px solid black;
  width: 300px;
  height: 300px;
}

tr,
td,
th {
  border: 1px solid black;
  text-align: center;
}

.td1 {
position: fixed;
width: 143px;
height: 96px;
margin-left: 5px;
}

div {
  width: 200px;
  height: 400px;
  overflow: auto;
}

<div>
 <table>
<tr>
  <th class='td1'>h1</th>
  <th>h2</th>
  <th>h3</th>
</tr>
<tr>
  <td class='td1'>D1</td>
  <td>D2</td>
  <td>D3</td>
</tr>
<tr>
  <td class='td1'>D1</td>
  <td>D2</td>
  <td>D3</td>
</tr>
</table>
</div>