css 设置文本单行显示超出省略号显示

2020-07-16  本文已影响0人  代码使劲儿搬

单行显示

.text{
  overflow:hidden; /*超出的文本隐藏*/
  text-overflow:ellipsis; /*溢出用省略号显示*/
  white-space:nowrap; /*溢出不换行*/
}

两行显示

.text{
  overflow: hidden;
  text-overflow: ellipsis;
  display:-webkit-box; /*作为弹性伸缩盒子模型显示。*/
  -webkit-box-orient:vertical; /*设置伸缩盒子的子元素排列方式--从上到下垂直排列*/
  -webkit-line-clamp:2; /*显示的行*/
}
上一篇 下一篇

猜你喜欢

热点阅读