如何为表格中的某些列设置固定宽度？

Question

我有包含列的表：

​

 <table style="table-layout: fixed; width: 100%; height: 100%;">
  <tr>
    <td>Column 1</td>
    <td class="сertainColumn">Column 2</td>
    <td>Column 3</td>
  </tr>
</table>

​

此外，我还可以动态更改页面宽度和表格宽度，还可以动态更改列宽。

当我增加宽度时，列的宽度成比例地增加。

如何冻结某些列的宽度？

Answer 1

很难说，看起来你只显示了HTML的一部分。我假设您已经在CSS中定义了certainColumn类，如下所示：

.certainColumn {
    width: 100px;
}

由于您已经应用了table-layout: fixed，因此第一行决定了列宽。您可能在所显示的行之前有其他行，这些行决定了列的宽度。

通常，标题行应用了任何固定的宽度，然后将宽度应用于以后的每一行。

<table ...>
    <tr>
        <th>...</th>
        <th class="thFixedWidth">...</th>
        <th>...</th>
    </tr>
    <tr>
        <td>...</td>
        <td>inherits fixed width from header column</td>
        <td>...</td>
    </tr>
</table>

<style>.thFixedWidth { width: 100px; }</style>