我如何设置我的td和th的宽度-相对于表格宽度的百分比？

在HTML中，<td>（表格数据单元格）和<th>（表格头单元格）的宽度可以通过CSS来设置。如果你想要设置这些单元格的宽度为相对于表格宽度的百分比，你可以使用CSS的width属性，并指定一个百分比值。

以下是一个简单的例子，展示了如何设置<td>和<th>的宽度为表格宽度的百分比：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Table Width Example</title>
<style>
  table {
    width: 100%; /* 表格宽度设置为100% */
    border-collapse: collapse; /* 合并边框 */
  }
  th, td {
    border: 1px solid black; /* 添加边框以便观察效果 */
    padding: 8px; /* 内边距 */
    text-align: left; /* 文本左对齐 */
  }
  th:first-child, td:first-child {
    width: 30%; /* 第一个单元格宽度为表格宽度的30% */
  }
  th:nth-child(2), td:nth-child(2) {
    width: 70%; /* 第二个单元格宽度为表格宽度的70% */
  }
</style>
</head>
<body>

<table>
  <tr>
    <th>Header 1</th>
    <th>Header 2</th>
  </tr>
  <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
  <!-- 更多行... -->
</table>

</body>
</html>

在这个例子中，我们设置了表格的宽度为100%，这意味着表格将占据其父容器的全部宽度。然后，我们为第一个<th>和<td>设置了30%的宽度，为第二个<th>和<td>设置了70%的宽度。