码迷,mamicode.com
首页 > 其他好文 > 详细

对word-wrap和word-break的理解

时间:2019-09-03 09:13:35      阅读:65      评论:0      收藏:0      [点我收藏+]

标签:一个   效果   问题   三方   更新   注意   支持   中英文   处理   

首先,对中文无效,对英文有效,原因是中英文处理不一样(更新:word-break:keep-all允许中文不换行,word-break:break-word;和word-wrap:break-word一样)。

对中文来说,当最后的空间容不下一个字符的时候,换到下一行,若下一行也容不下一个字符,也仍只能如此,连一个中文字符都容不下,只能是设计问题。

对英文来说,也容不下一个单词的时候,也只能换行,如果下一行也容不下这个”单词“的时候,你说要不要让他溢出?比如特别长的字符串。

第一、默认先换行,默认允许字符串溢出显示。

第二、默认先换行,允许将字符串溢出的部分换行。word-wrap:break-word;

第三、不换行,将字符串溢出的部分换行。word-break:break-all;

这三种方法均有优缺点,视情况一般选择第二和第三方式显示,第二适合传统正常英文文章,第三适合,不是传统意义上的单词,而是如url,md5这样的长字符串。

这两个属性均由微软在IE5.5中引入,其他浏览器也支持。在新的CSS3草案中,word-wrap正式名称改为overflow-wrap,原名作为别名仍可使用。

不过我觉得,既然要改的话,我觉得也可也这样改overflow-word: one-line | multiple-line | free-line;

word-break:break-all;可以单独使用,与前一句连用效果是一样的。

值得注意的是,在table td中word-wrap:break-word;无效,word-break:break-all;有效。

对word-wrap和word-break的理解

标签:一个   效果   问题   三方   更新   注意   支持   中英文   处理   

原文地址:https://www.cnblogs.com/webkb/p/11450801.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!