css多行文本超出显示省略号,以2行为例,网上很多解决方法,如下。之前一直采用的是这种方法,最近发现无效了。vant也是这种写法,
.txt-ellipsis-2 {
display:-webkit-box;
overflow: hidden;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
text-overflow: ellipsis;
word-break: break-all;
}
排查后发现要改成下面写法
{
display: -webkit-box;
overflow: hidden;
/*! autoprefixer: off; */
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
最重要的变化是要关闭-webkit-box-orient的autoprefixer,要不然编译出来这个属性会被去除,导致没有效果。另外发现text-overflow和word-break不需要配置了。