CSS -webkit-box-orient: vertical属性编译后丢失问题详解

一、起因

需求要求展示两行，多余的文字用 三个点 替代，于是用了这几个不太规范的属性

dis play : - webkit -box;
-webk IT -line-cl am p: 2;
-webkit-box-orient: vert ical ;

后来发现代码里写的好好的，一到页面上居然没有反应，和没写一个样， F1 2看了下， 原来 是-webkit-box-orient: vertical;这个属性丢失，导致了不 生效 ，在Styles里把这个属性加上就好了，于是断定是编译过程导致这个属性丢失。

二、解决办法

网上找了一个可行的解决 方案 ，把auto PR efixer关掉，有一种写法：

/*! autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */

这样确实解决了编译丢失的情况，但会在编译 过程中 报warning，最后到GitH ub 上找到 最佳解决方案 ,如下

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

问题完美解决，也不报warning了。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

总结

以上是 为你收集整理的 CSS -webkit-box-orient: vertical属性编译后丢失问题详解 全部内容，希望文章能够帮你解决 CSS -webkit-box-orient: vertical属性编译后丢失问题详解 所遇到的问题。

如果觉得 网站内容还不错， 推荐好友。

查看更多关于CSS -webkit-box-orient: vertical属性编译后丢失问题详解的详细内容...