1.自动换行:
word-wrap:break-word;
魔兽世界:正规;
2.强制换行:
word-break:break-all; 通过字符换行的截断/*与IE和chrome相对应,FF为*/
word-wrap:break-word; 按英语单词截断换行符/*以上三个浏览器都是*/
*注意:对于单词换行符,父框必须是块级元素
3.强制不换行:
white-space:nowrap;
属性规定文本溢出包含元素时发生。 文本覆盖:剪辑;
常用场景width:100px; /*要显示的文本宽度*/text-overflow :ellipsis; /*将被截断的文字显示为点。 另一个值表示clip不显示点*/white-space :nowrap; 防止/*字符换行*/overflow :隐藏; */overflow :隐藏; /*超出则隐藏*
多行文本溢出显示(…) div { width: 300px; height: 40px; /*白色-空格:nowrap; */overflow :隐藏; display: -webkit-box; - WebKit-box-orient : vertical; -webkit-line-clamp: 2; 文本覆盖: ellipsis; }适用范围:
由于使用了WebKit的CSS扩展属性,因此此方法适用于WebKit浏览器和移动端;
请注意,ie核心浏览器必须定义线高度和高度。 -webkit-line-clamp表示几行。 例如
line-height: 20px;
最大高度: 40px;
display: -webkit-box;
- WebKit-box-orient : vertical;
-webkit-line-clamp: 2;
overflow :隐藏;
在标题的最后,这个APP场景还可以,
我不怎么频繁地写。
写博客并记录
暂时正在补充多行