CSS流体和固定柱

Question

我有桌子，例如：

<table>
 <tr>
  <td>
  </td>
  <td>
  </td>
  <td class="fixed">
  </td>
 </tr>
</table>

例如我的表格宽度为800px。

所有前两列必须是流动的，但最后一行：固定......

我怎么能这样做？

如果我的前两列非常小，那会怎么样？如何固定到右边？ （也是高度流动）

Answer 1

• <table>获取table-layout: fixed;这将允许第三列保持其固定宽度

• 该表格还有max-width: 800px和width: 100%;它会调整大小

• 我们在表格中放置了三个<col> elements来表示列;第三列使用width: 250px

获取课程

完整示例

table {
  table-layout: fixed;
  max-width: 800px;
  width: 100%;
}
.fixed {
  width: 250px;
}
td {
  padding: 10px;
  border: solid 1px #000;
}

<table>
  <col>
  <col>
  <col class="fixed">
        <tr>
          <td>
          </td>
          <td>
          </td>
          <td>
          </td>
        </tr>
</table>