html – 表格列宽与包含数据一样窄吗？

我有三列.我想要的最后两个与它们包含的数据一样窄,第一列可以取宽度的其余部分(表的宽度为100％).

你怎么能用CSS做到这一点？现在右边的列看起来很傻,有额外的空间.想法？

解决方法

只需给第一列宽度为100％,并在必要时为所有其他列中的单元格提供一个空格：Nowrap以避免其内容被包装(仅在必要时再次).

例如.

<table>
    <tr><td class="first">first</td><td>second</td><td>third</td></tr>
    <tr><td class="first">first</td><td>second</td><td>third</td></tr>
    <tr><td class="first">first</td><td>second</td><td>third</td></tr>
</table>

同

table { width: 100%; }
table td.first { width: 100%; }

或者现代的方式,如果你不打扰IE6用户：

table { width: 100%; }
table td:first-child { width: 100%; }

(这样你就可以删除class =“first”)