这个属性用的贼多,我还老是忘,今天记录一下
单行文本显示省略号
1..a{ overflow:hidden; /*超出的部分隐藏起来。*/ white-space:nowrap;/*不让文本换行,在一行显示*/ text-overflow:ellipsis;/*超出显示...*/ }
多行文本超出显示省略号
-webkit-是webkit内核的前缀(Chrome)
.a{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box;/*将对象作为弹性伸缩盒子模型显示*/ -webkit-line-clamp:2 ;/*限制在块元素文本的行数,它需要组合其他的WebKit属性*/ -webkit-box-orient:vertical;/*设置盒子的子元素的排列方式*/ }
最后补充:
在WebKit浏览器或移动端(绝大部分是WebKit内核的浏览器),可以直接使用WebKit的CSS扩展属性
text-overflow:设置文字溢出之后的效果