css Table 设置列宽

你可以使用CSS的`width`属性来设置表格中列的宽度。以下是一些常见的用法：

1. 设置所有列的宽度相等：

table {
  table-layout: fixed;
  width: 100%;
}

td {
  width: 25%;
}

2. 设置每列的宽度不同：

table {
  table-layout: fixed;
  width: 100%;
}

td:first-child {
  width: 30%;
}

td:nth-child(2) {
  width: 20%;
}

td:last-child {
  width: 50%;
}

在上面的代码中，我们使用了CSS的`table-layout`属性来指定表格布局为固定布局，这将使得列的宽度按照我们设置的值来显示，而不是根据内容自动调整。

注意：使用`table-layout: fixed`时，如果列的宽度超过了表格的宽度，那么列的内容可能会被截断。

相关问题

html table设置列宽

在HTML中，你可以使用`<table>`标签来创建表格，并通过`<th>` (表头) 或 `<td>` (数据单元格) 的`style`属性来设置列宽。对于表头单元格，可以直接在`<th>`标签内设置，例如：

<th style="width: 200px;">列名</th>

对于数据单元格，通常是在每个`<td>`元素上应用样式，例如：

<td style="width: 200px;">数据</td>

另外，如果你希望基于百分比来设置宽度，可以使用`%`作为单位，如：

<td style="width: 50%;">50%的宽度</td>

如果你想在整个浏览器窗口下自适应调整列宽，可以考虑CSS布局技术，比如栅格系统（grid）或Flexbox。

table设置固定列宽

要设置table中的列宽固定，可以使用CSS中的`table-layout: fixed;`属性。这会使得列宽按照table元素中的宽度进行分配，而不是根据内容自动调整宽度。接着，可以使用`width`属性设置每列的具体宽度，如下所示：

table {
  table-layout: fixed;
}

table th:first-child,
table td:first-child {
  width: 100px;
}

table th:nth-child(2),
table td:nth-child(2) {
  width: 200px;
}

table th:last-child,
table td:last-child {
  width: 150px;
}

上述代码将第一列设置为100px宽度，第二列设置为200px宽度，最后一列设置为150px宽度。根据实际需求，可以自行调整每列的宽度。