-webkit-line-clamp在开发环境有效而在线上环境无效（chrome）

Question

问题： webkit-line-clamp在开发环境有效而在线上环境无效（chrome）

线上环境：

开发环境：

而在segmentfault思否首页的文章列表展示中，它的也是使用这种方式，而且可以生效。原因未知。

Answer 1

你没发现 -webkit-box-orient: vertical 这行不见了吗，应该是 css 压缩过程中 autoprefixer 检测到 webkit-box-orient 在配置的 browserslist 中无效所以自动移除了。可以利用评论告诉 autoprefixer 忽略 -webkit-box-orient:

/*! autoprefixer: ignore next */
-webkit-box-orient: vertical;

Answer 2

在 browserslist里加上Safari 6

这个配置一般在 package.json里 或者 .browserslistrc文件

Answer 3

试试加上

overflow: hidden;