word-wrap、white-space和word break的区别

1、word-wrap:break-word;

内容将在边界内换行,仅用于块对象,内联对象要用的话,必须要设定height、width或display:block或position:absolute。

word-wrap、white-space和word break的区别
word-wrap、white-space和word break的区别

2、word-break:break-all;

用于处理单词折断。(注意与第一个属性的对比)

word-wrap、white-space和word break的区别
word-wrap、white-space和word break的区别
 

3、white-space:nowrap;

用于处理元素内的空白,只在一行内显示。

word-wrap、white-space和word break的区别
word-wrap、white-space和word break的区别
 

4、overflow:hidden;

超出边界的部分隐藏。

word-wrap、white-space和word break的区别
word-wrap、white-space和word break的区别
 

5、text-overflow:ellipsis;

超出部分显示省略号。

word-wrap、white-space和word break的区别
word-wrap、white-space和word break的区别

 

来自百度经验

posted @ 2017-05-16 18:46  少东主  阅读(198)  评论(0编辑  收藏  举报