包装在HTML表格中
我一直在使用word-wrap: break-word来包装div和span的文本。 但是,它似乎不适用于表格单元格。 我有一个表设置为width:100% ,一行两列。 列中的文本虽然使用上述word-wrap进行了样式word-wrap ,但不包装。 它会导致文本超出单元格的边界。 这发生在Firefox,Google Chrome和Internet Explorer上。
以下是源代码的样子:
td {
border: 1px solid;
}<table style="width: 100%;">
<tr>
<td align="left">
<div style="word-wrap: break-word;">Long Content</div>
</td>
<td align="right"><span style="display: inline;">Short Content</span>
</td>
</tr>
</table> 以下在Internet Explorer中适用于我。 请注意添加table-layout:fixed CSS属性
td {
border: 1px solid;
}<table style="table-layout: fixed; width: 100%">
<tr>
<td style="word-wrap: break-word">
LongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongWord
</td>
</tr>
</table><td style="word-break:break-all;">longtextwithoutspace</td>
要么
<span style="word-break:break-all;">longtextwithoutspace</span>
一个长镜头,但仔细检查与Firebug(或类似),你不是不小心继承了以下规则:
white-space:nowrap;
这可能会覆盖您指定的换行符。
链接地址: http://www.djcxy.com/p/15469.html