[英]CSS: Wrap text AND break word if necessary
How can I set up a div such that it will wrap text AND will also break word if necessary? 如何设置div以便它将包装文本并在必要时也会破坏文字? Examples below, with the dots showing the width of the div ("zzzzzzz..." is all one word).
下面的示例,点显示div的宽度(“zzzzzzz ......”都是一个单词)。
.................................... ....................................
Hello these are 你好,这些是
words 话
.................................... ....................................
zzzzzzzzzzzzzzzzzz zzzzzzzzzzzzzzzzzz
zzzzzz ZZZZZZ
You can use css word-wrap: break-word;
你可以使用css
word-wrap: break-word;
.wrap { width: 50px; word-wrap: break-word; border: 1px solid red }
<div class="wrap">This is a mormal div wrapping and breaking words</div>
and if you want a word to be separated at a certain position when it's too long for the container, you can use the ­
如果你想要一个单词在某个位置被分开,当它对于容器来说太长时,你可以使用
­
entity (soft hyphen). 实体(软连字符)。 So the HTML
所以HTML
singledoubletriple­quadruplequintupleburger
will remain 会保持
singledoubletriplequadruplequintupleburger
on the screen when it fits in one line, but become 在屏幕上,当它适合一行,但成为
singledoubletriple-
quadruplequintupleburger
if the line is shorter 如果线条较短
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.