我注意到a的内容td所有列上的 colspan 都会影响其他行的宽度td.
谁能解释一下这是为什么以及如何让它正常工作？
我有两个要求
- 第一行第二列应占用尽可能多的空间（展开）
- 第二行应采用 100% 宽度，在示例中使用 colspan=2
Note：我正在研究一些 CSS 属性并发现断字：打破所有会解决这个问题，但我想了解这个问题和/或有更好的解决方案。
这是带有较长文本的示例：
<table border="1">
<colgroup>
<col>
<col style="width:100%">
</colgroup>
<tr>
<td>aaaaaaaaaaaaaaaaaaaaaa</td>
<td>Take as much space as possible, expand</td>
</tr>
<tr>
<td colspan="2">loooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong</td>
</tr>
</table>
这里的结果是较短的文本，您可以看到第一行现在不同了。
<table border="1">
<colgroup>
<col>
<col style="width:100%">
</colgroup>
<tr>
<td>aaaaaaaaaaaaaaaaaaaaaa</td>
<td>Take as much space as possible, expand</td>
</tr>
<tr>
<td colspan="2">shorter</td>
</tr>
</table>
table也许是其中最奇怪的元素，并且具有跨浏览器的历史原因问题，我不能说为什么它在不同的浏览器中表现不同，它就是这样。
在你的情况下，在第一个上设置一个小宽度td将帮助解决您的问题。
table {
width: 100%;
}
<table border="1">
<colgroup>
<col style="width:5%">
<col style="width:95%">
</colgroup>
<tr>
<td>aaaaaaaaaaaaaaaaaaaaaa</td>
<td>Take as much space as possible, expand</td>
</tr>
<tr>
<td colspan="2">looooooooooooooooooooooooooooooooooooooooooooooooong</td>
</tr>
</table>
<table border="1">
<colgroup>
<col style="width:5%">
<col style="width:95%">
</colgroup>
<tr>
<td>aaaaaaaaaaaaaaaaaaaaaa</td>
<td>Take as much space as possible, expand</td>
</tr>
<tr>
<td colspan="2">short</td>
</tr>
</table>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
