2

是否有插件或这种性质的东西可以让我这样编写 CSS:

transition:all 300ms; 
box-shadow:0 3px 2px #222; 
backface-visibility:hidden;

ETC..

对于需要-webkit-, -moz-,-ms-等的浏览器版本-o-。在加载样式表时自动添加到需要的地方。

4

1 回答 1

5

是的,-prefix-free让你在任何地方都只使用无前缀的 CSS 属性。它在幕后工作,仅在需要时将当前浏览器的前缀添加到任何 CSS 代码中。项目网站

特征

  • 处理或元素中的每个样式表,并在需要时添加供应商前缀
  • 处理具有样式属性的元素并在需要时添加供应商前缀
  • 处理新元素、样式属性更改和 CSSOM 更改(需要插件)
  • 让 jQuery 的 .css() 方法获取和设置无前缀属性(需要插件)

限制

  • 不支持在 @import-ed 文件中添加前缀代码
  • 不支持为跨域链接样式表添加前缀,除非它们启用了 CORS
  • 无前缀的链接样式表在 Chrome 和 Opera 中无法本地工作。你可以自己改变它。
  • 内联样式中的无前缀值(在 style 属性中)在 IE 和 Firefox < 3.6 中不起作用。Firefox < 3.6 中的属性也是如此。

如何使用

只需在页面的任何位置包含 prefixfree.js。建议将其放在样式表之后,以最小化 FOUC

就是这样,你完成了!

浏览器支持

目标浏览器支持桌面版IE9+Opera 10+Firefox 3.5 + 、Safari 4+和Chrome以及移动版 SafariAndroid 浏览器Chrome 和 Opera Mobile


前缀mycss

此外,还有一项在线服务,可让您粘贴未加前缀的 css 代码并返回带有所有供应商前缀的 css。http://prefixmycss.com/


CSS3请

css3please.com:一个跨浏览器的 css3 规则生成器,由 Jonathan Neal 和 Paul Irish 制作。除了同步和规范化必要属性的更改外,它还通过 IE 过滤器潜入 IE 对一些功能的支持。


SASS 和指南针

另一种方法是使用 CSS 预处理器SASSCOMPASS mixins。

Sass是 CSS3 的扩展,它添加了嵌套规则、变量、混合、选择器继承等。Sass 生成格式良好的 CSS 并使您的样式表更易于组织和维护。

Compass允许扩展 Sass,它充满了可重用的模式,它允许基于最佳实践以简单和标准的方式使用 sprite、CSS3 和排版。


最后我建议你阅读 Paul Irish 的一篇文章,他是谷歌最好的前端开发人员之一:http: //paulirish.com/2012/vendor-prefixes-are-not-developer-friendly/

于 2012-12-31T16:57:36.870 回答