我有一张桌子，有一个 TR 和 2 个 TD。我希望第一个 TD 根据其内容自动调整宽度，第二个 TD 用完剩余的宽度。
这就是我所拥有的：
<table style="width: 100%;">
<tr>
<td>short content</td>
<td>long content</td>
</tr>
</table>
整个表格宽度是100%（如我想要的），但我不知道如何调整TD宽度来实现我的目标。
你可以给第一个td小宽度，例如1px, with white-space: nowrap;
table {
width: 100%;
border-collapse: collapse;
}
td {
border: 1px solid red;
}
td:first-child {
width: 1px;
white-space: nowrap;
}
<table>
<tr>
<td>short content</td>
<td>long content</td>
</tr>
</table>
或者，给最后一个td大宽度，例如100%.
table {
width: 100%;
border-collapse: collapse;
}
td {
border: 1px solid red;
}
td:first-child {
white-space: nowrap;
}
td:last-child {
width: 100%;
}
<table>
<tr>
<td>short content</td>
<td>long content</td>
</tr>
</table>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
