-webkit-box-orient属性丢失？

在实际项目场景当中，我们经常会遇到需要对超长文本溢出省略的场景：

我们经常会这样写——

单行省略：

    overflow: hidden; //文本溢出隐藏
	text-overflow: ellipsis; //文本溢出显示省略号
	white-space: nowrap; //不换行

多行省略：

      display: -webkit-box; /**对象作为伸缩盒子模型展示**/
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2; /**显示的行数**/
      overflow: hidden; /**隐藏超出的内容**/
      text-overflow: ellipsis; /* 溢出显示省略号 */

在一个新项目中，我需要设置两行溢出省略，然后我还是按照旧的方式写上去，这个时候我发现，在页面中并没有生效。。。

然后我去查看了浏览器上面生效的样式属性，如图：

这个时候我们会发现，-webkit-box-orient: vertical;这个属性没有在浏览器生效，丢失了！然后我去查找了相关资料，再代码中加了一行/* autoprefixer: ignore next */，如下：

      display: -webkit-box; /**对象作为伸缩盒子模型展示**/
      /* autoprefixer: ignore next */
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2; /**显示的行数**/
      overflow: hidden; /**隐藏超出的内容**/
      text-overflow: ellipsis; /* 溢出显示省略号 */

浏览器样式渲染