关于H5 移动端css 文本超出时省略号 失效的问题

之前写代码的时候遇到一个问题,就是用了下面这段css代码来让文字超出范围隐藏并显示省略号。

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

然鹅本地运行的时候是没有问题的,但是build之后发现失效了。仔细一看是 -webkit-box-orient: vertical; 没有起效。
最后各种修改之后发现应该是webpack的锅
解决方案是改成下面这样

    overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: ;
/*! autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */
上一篇:hdu 1116 Play on Words(欧拉通路)


下一篇:HTML技巧篇:如何让单行文本以及多行文本溢出时显示省略号(…)