CSS，Text溢出表格单元格

Question

我正在研究虚拟机，所以我无法复制代码......然后我将发布屏幕。 问题是微不足道的我想但我不能处理它...请给我一些建议：

表代码： https ： //dl.dropboxusercontent.com/u/108321090/WWW1.png

CSS代码和网站视线： https ： //dl.dropboxusercontent.com/u/108321090/WWW.png

所以一般情况下，你可以在第二个链接上看到，行中有一个文本，它不需要包装，它一直作为通道进入并离开表列边界。

Answer 1

说明性示例

假设您有一个简单的两行表，每行有两个单元格：

<table>
    <tr>
        <th>First</th>
        <th>Second</th>
    </tr>
    <tr>
        <td>Tiny text</td>
        <td>VeryLongNonBreakingLineOfTextThatNeedsToWrap</td>
    </tr>    
</table>

其中一个单元格有一个非常长的单词，没有空格，没有连字符，所以它不会破坏。

这是一些CSS：

table {
    border: 1px solid lightgray;
}
table th {
    background-color: silver;
    text-align: center;
    padding: 10px;
}
table td {
    width: 200px;
    border: 1px dotted silver;
    word-break: break-all;
}

细胞的固定宽度为200px。 但是，由于长时间没有破坏的话，可能会发生两件事。

（1）表格可以增加列宽以容纳长文本。
（2）文本可能会根据其他因素流出单元格，例如使用具有指定表格宽度的固定布局。

如果对表格单元格应用word-break: break-all ，则文本将换行，表格列将保留其预定义的宽度。

请参阅演示： http ： //jsfiddle.net/audetwebdesign/xtKLE/

参考

要了解有关CSS3分词属性的更多信息， 请访问 ： http ： //www.w3.org/TR/css3-text/#word-break