您的位置 首页 > 数码极客

【word英文单词换行断开】css单词换行and断词,你真的完全了解吗?

以下单词直接中断换行。

这包括两个CSS属性。

Word-break(当行尾不能放置下一个单词时,决定该如何放置在单词内)

Word-wrap(确定无法放置行尾时是否允许在单词内换行)

Normal使用浏览器的默认换行规则。


break-all 允许在单词内换行(强行上,挤不下的话剩下的就换下一行显示)。

keep-all 只能在半角空格或连字符处换行(放不下了,那就另起一行展示)。

normal 只在允许的断字点换行(单词太长,换行显示,再超过一行就溢出显示)。

break-word 在长单词或 URL 地址内部进行换行(当单词太长时,先尝试换行,换行后还是太长,单词内还可以换行)。

还有话说!

注意,上面这些换行神马的都是针对英文单词,像CJK(中文/日文/韩文)这样的语言就算了,因为他们不需要(真不影响阅读)。

在来看开头那张图里的问题,你加上 word-break: keep-all;word-wrap: break-word;正常就可以了。如有问题,欢迎讨论评论区或者直接私信。

关于作者: admin

无忧经验小编鲁达,内容侵删请Email至wohenlihai#qq.com(#改为@)

热门推荐