Question

目前，我有一个类似于

的表格

<table>
    <tr>
        <th>Submitted</th>
        <th>Title</th>
        <th>Revisions</th>
    </tr>
    <tr>
        <td>Nov. 22, 2011, 2:14 a.m.</td>
        <td><a href="/essays/edit/6">Hello</a></td>
        <td>2</td>
    </tr>
</table>

我需要Title列尽可能宽，而其他列足够以包含其内容。我还需要桌子来填充其容器（100％宽度）。
如何实现这一目标？

Answer 1

这可能是一个快速而又肮脏的黑客攻击，但您只需使用以下CSS：

td, th {
    white-space: nowrap; /* to prevent splitting content into several lines */
}
th:nth-of-type(2) {
    width: 100%;
}

表格中的单元格无法超出其整体宽度，因此可能有效。

或者，您可以使用JavaScript动态计算中间列宽度或设置固定单元格宽度。

在HTML表格中设置列宽

1 个答案: