CSS的word-wrap属性

接着上一篇word-break,继续说说CSS的换行。

这次说的word-wrap,同样是设置换行的,他有两个可能的值:

  • normal
  • break-word

做了个Demo,大家可以打开自己看看。

normal

normal和word-break的下的normal效果一样的,就是按照文字自己的规则判断是否换行。这里要注意的是,低版本IE(IE6),在“容器”宽度连一个单词都放不下的时候,会撑开容器。

chrome,firefox,IE7+,Opera等的效果:

IE6以下的效果:

break-word

break-word会使内容将在边界内换行。如果需要,词内换行(word-break)也会发生。所谓的“需要”,就是指容器宽度连一个词都放不下。

所有浏览器显示效果是一致的,大家可以打开Demo看看。



标签:

发表评论

电子邮件地址不会被公开。 必填项已用*标注

您可以使用这些HTML标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

无觅相关文章插件,快速提升流量