试试这个

div { 显示:块; 显示:-webkit-box; 高度:20 px; Margin: 3px auto; 字体大小:14 px; 行高:1.4; -webkit-line-clamp: 1; -webkit-box-orient:垂直; 溢出:隐藏; 文本溢出:省略; ｝

属性text-overflow:省略号add…而线夹则显示线数。

使用word-wrap:break-word属性以及所需的宽度。主要是, 宽度以像素为单位，而不是百分比。

width: 200px;
word-wrap: break-word;

div {
    /* Set a width for element */
    word-wrap: break-word
}

“换行”解决方案只适用于IE和支持CSS3的浏览器。

最好的跨浏览器解决方案是使用您的服务器端语言(php或其他)来定位长字符串，并定期在其中放置html实体​ 这个实体很好地分割了长单词，并且适用于所有浏览器。

e.g.

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa​aaaaaaaaaaaaaaaaaaaaaaaaaaaaa

另一种选择也使用:

div
{
   white-space: pre-line;
}

这将在所有支持CSS1的浏览器中设置所有div元素(这几乎是所有常见的浏览器，直到IE 8)

你可以像这样使用软连字符:

啊

这将显示为

aaaaaaaaaaaaaaa-
aaaaaaaaaaaaaaa

如果装盒不够大，或者

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

如果是的话。

在IE、Firefox、chrome、safari和opera中，如果单词中没有空格(比如一个很长的URL)，唯一适用的方法是:

div{
    width: 200px;  
    word-break: break-all;
}

我发现这个是防弹的。