像aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa这样的文本超过了div的宽度(比如200px),如何被包装?

我是开放的任何一种解决方案,如CSS, jQuery等。


当前回答

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

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

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

e.g.

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa​aaaaaaaaaaaaaaaaaaaaaaaaaaaaa

其他回答

跨浏览器

.wrap
{
    white-space: pre-wrap; /* css-3 */    
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */    
    white-space: -o-pre-wrap; /* Opera 7 */    
    word-wrap: break-word; /* Internet Explorer 5.5+ */
}

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

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

我发现这个是防弹的。

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)

试试这个

div {display: inline;}