vue中打包后出现css中文本超出部分隐藏显示省略号失效

801 阅读1分钟

在项目中使用以下代码控制文本超出,在本地是正常的,但是打包到测试服务器上就失效了,发现是跟-webkit-box-orient:vertical;这个属性有关,webpack打包后-webkit-box-orient被移除(autoprefixer自动移除老式过时的代码),所以导致失效。

overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;

解决:

overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;
/*! autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */

参考:blog.csdn.net/screaming_c…