Html 如何使表格中一行的最后一个单元格占据所有剩余宽度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1060933/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make last cell of a row in a table occupy all remaining width
提问by ikaushan
In the below HTML fragment, how can I make the width of a column that contains 'LAST' occupy the remainder of the row, and widths of columns that contain 'COLUMN ONE' and 'COLUMN TWO' be just wide enough to contain their content, and not larger.
在下面的 HTML 片段中，如何使包含“LAST”的列的宽度占据行的其余部分，而包含“COLUMN ONE”和“COLUMN TWO”的列的宽度刚好足以包含其内容，而不是更大。
Thank you
谢谢
table {
border-collapse: collapse;
}
table td {
border: 1px solid black;
}<table>
<tr>
<td>
<table width="100%">
<tr>
<td>
<span>
COLUMN
</span>
<span>
ONE
</span>
</td>
<td>
COLUMN TWO
</td>
<td>
LAST
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
ANOTHER ROW
</td>
</tr>
</table>回答by jeroen
You will need to tell the first two columns not to wrap and give the last column a width of 99%:
您需要告诉前两列不要换行，并为最后一列指定 99% 的宽度：
<table width="100%">
<tr>
<td style="white-space: nowrap;">
<span>
COLUMN
</span>
<span>
ONE
</span>
</td>
<td style="white-space: nowrap;">
COLUMN TWO
</td>
<td width="99%">
LAST
</td>
</tr>
</table>
Edit:You should put that all styles / presentation in (external...) css.
编辑：您应该将所有样式/演示文稿放在（外部...）css 中。
Using classes for the columns (you could use css3 selectors like nth-child()instead if you only target modern browsers):
为列使用类（nth-child()如果您只针对现代浏览器，则可以使用 css3 选择器）：
html:
html：
<tr>
<td class="col1">
// etc
css:
css：
.col1, .col2 {
white-space: nowrap;
}
.col3 {
width: 99%;
}
