是否有一个css“编译器”自动扩展以涵盖所有/大多数浏览器？

Question

使用-webkit，-moz -o前缀（例如转换，转换等）专门查看内容...

我想要一些像smart sass（我认为可能会这样做，但似乎没有）的东西，它将采用通用形式的命令并为我编写所有长前缀版本。例如：

    .shrink {
        -webkit-transition: -webkit-transform 1s;
        -webkit-transform: scale(0);
        -moz-transition: -moz-transform 1s;
        -moz-transform: scale(0);
        -o-transition: -o-transform 1s;
        -o-transform: scale(0);
    }

将写为

    .shrink {
        transition: transform 1s;
        transform: scale(0);
    }

并且css“编译器”会写出所有其他的东西.....

Answer 1

2018编辑

我在webpack中使用https://github.com/postcss/autoprefixer来完成原始问题中提到的“css编译”

---

原创2011年回答

这是一个： http://www.techievideos.com/videos/1152/Save-time-writting-vendor-prefixes-using-CSS3-and-LESS/

---

实现目标的另一个选择：

这是一个css3转换器，可生成一个背景图像，该图像可供不兼容/旧浏览器使用。值得一看！

http://www.css3toimage.com/

Answer 2

是

SCSS + Compass会得到你想要的东西（只要你不介意Ruby /命令行编译。）

以下是Compass' example pages之一的示例：

<强> SCSS：

    @include background-clip(padding-box);

    @include background-clip(border-box);

这些扩展为：

-moz-background-clip: padding;
-webkit-background-clip: padding;
-o-background-clip: padding-box;
-ms-background-clip: padding-box;
-khtml-background-clip: padding-box;
background-clip: padding-box;

/* And */

-moz-background-clip: border;
-webkit-background-clip: border;
-o-background-clip: border-box;
-ms-background-clip: border-box;
-khtml-background-clip: border-box;
background-clip: border-box;

Answer 3

Here您找到了大量的webkit css属性。它们中的大多数类似于-o或-moz！