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

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


当前回答

来自CSS技巧的例子:

div {
    -ms-word-break: break-all;

    /* Be VERY careful with this, breaks normal words wh_erever */
    word-break: break-all;

    /* Non standard for webkit */
    word-break: break-word;

    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
}

这里有更多的例子。

其他回答

使用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

将此CSS添加到段落中。

width:420px; 
min-height:15px; 
height:auto!important; 
color:#666; 
padding: 1%; 
font-size: 14px; 
font-weight: normal;
word-wrap: break-word; 
text-align: left;

试试这个CSS属性-

overflow-wrap: anywhere;

试试这个

div {display: inline;}