一个消除CSS中供应商前缀的脚本

A Script to Eliminate Vendor Prefixes in CSS

本文关键字:供应商 前缀 脚本 CSS 一个      更新时间:2023-09-26

是否有一个脚本,我可以在我的网站上包含,将自动扔在供应商的前缀CSS?我想只写标准的CSS,这样几年后我就不用回去去掉供应商的前缀了。

刚刚找到这个,它看起来很完美:http://leaverou.github.com/prefixfree/

我不知道有什么脚本可以特别做到这一点,但我一直在用LESS而不是直接使用CSS编写所有内容。这样你就可以把梯度之类的东西放到mixins中(有点像函数),然后你只需要改变一小部分声明。而不是在多个文件上执行。当然,混合通常会导致大量的重用,不仅仅是对供应商声明,而是对很多东西(例如,我通常定义一个调色板和图标集,以及基于960.gs的网格混合)。

在动态站点上,我通常设置为在服务器端编译和缓存。在静态站点上,我只是在部署之前使用shell脚本将less直接编译为css。

我写了这样一个脚本,在生产中使用,没有依赖关系:http://imsky.github.com/cssFx/

考虑到CSS的层叠特性,您可以包含两个样式表,第一个第二个遵循官方CSS3,而第二个第一个其中一个覆盖某些设置来完成您需要的供应商特定的东西,使其实际工作。然后在将来你(显然)只要删除第二个第一个样式表…

没有理由消除供应商前缀,除非你不喜欢它们给你的代码增加混乱。

至于他们为什么会出现在这里,A List Apart http://www.alistapart.com/articles/prefix-or-posthack/上的这篇文章提供了有价值的见解。基本上,拥有它们比不拥有它们容易。

如果你的CSS级联正确,如:

-webkit-border-radius: 5px;
        border-radius: 5px;

然后当Chrome和Safari放弃供应商前缀的样式将自然级联,你不需要删除任何东西(除非你担心额外的字节他们添加)。