像aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa这样的文本超过了div的宽度(比如200px),如何被包装?
我是开放的任何一种解决方案,如CSS, jQuery等。
像aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa这样的文本超过了div的宽度(比如200px),如何被包装?
我是开放的任何一种解决方案,如CSS, jQuery等。
当前回答
这对我很有效
word-wrap: normal;
word-break: break-all;
white-space: normal;
display: block;
height: auto;
margin: 3px auto;
line-height: 1.4;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
其他回答
使用word-wrap:break-word属性以及所需的宽度。主要是, 宽度以像素为单位,而不是百分比。
width: 200px;
word-wrap: break-word;
在HTML正文中尝试:
<table>
<tr>
<td>
<div style="word-wrap: break-word; width: 800px">
Hello world, how are you? More text here to see if it wraps after a long while of writing and it does on Firefox but I have not tested it on Chrome yet. It also works wonders if you have a medium to long paragraph. Just avoid writing in the CSS file that the words have to break-all, that's a small tip.
</div>
</td>
</tr>
</table>
在CSS正文尝试:
background-size: auto;
table-layout: fixed;
<p style="word-wrap: break-word; word-break: break-all;">
Adsdbjf bfsi hisfsifisfsifs shifhsifsifhis aifoweooweoweweof
</p>
在引导3中,确保空白没有设置为“nowrap”。
div {
width: 200px;
word-break: break-all;
white-space: normal;
}
div {
/* Set a width for element */
word-wrap: break-word
}
“换行”解决方案只适用于IE和支持CSS3的浏览器。
最好的跨浏览器解决方案是使用您的服务器端语言(php或其他)来定位长字符串,并定期在其中放置html实体​ 这个实体很好地分割了长单词,并且适用于所有浏览器。
e.g.
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa​aaaaaaaaaaaaaaaaaaaaaaaaaaaaa