html table自适应列宽

以下是两种HTML表格自适应列宽的方法：

1.使用CSS的table-layout属性，将其设置为auto即可让表格自适应列宽。示例代码如下：

<style>
table {
  table-layout: auto;
  width: 100%;
}
</style>

<table>
  <tr>
    <th>Header 1</th>
    <th>Header 2</th>
    <th>Header 3</th>
  </tr>
  <tr>
    <td>Content 1</td>
    <td>Content 2</td>
    <td>Content 3</td>
  </tr>
</table>

2.使用CSS的calc()函数，将列宽设置为百分比和像素值的组合，以实现自适应列宽。示例代码如下：

<style>
table {
  width: 100%;
}
td {
  width: calc(33.33% - 10px);
  /* 10px是用来调整列之间的间距 */
}
</style>

<table>
  <tr>
    <td>Content 1</td>
    <td>Content 2</td>
    <td>Content 3</td>
  </tr>
</table>