创新路
我们一直在努力

是时候啦!请放弃CSS浏览器前缀(CSS Vendor Prefixes)吧

在我们编写CSS代码的时候,经常需要编写各种CSS浏览器前缀(CSS Vendor Prefixes)。每当新的CSS属性在被正式添加到W3C标准中之前,各个浏览器厂商都会使用自己的方法来测试和实现这些新的属性。

CSS浏览器前缀是与各个浏览器引擎相关的字符串,它们通常放置在CSS属性的前面。它的格式通常为:

'-' + 浏览器前缀 + '-' + CSS属性名称

下面的表格中列出了常用浏览器和它们的相应浏览器前缀标识。

浏览器前缀 浏览器
-webkit- Google Chrome, Safari, Android Browser
-moz- Firefox
-o- Opera
-ms- Internet Explorer, Edge
-khtml- Konqueror

例如,Firefox浏览器在使用CSS3 transform属性时的相应浏览器前缀代码为:

.example {
  -moz-transform: value;
}

CSS浏览器前缀之前看起来很好,可惜太繁琐了,你需要用几行不同的代码来实现其实完全一样的工作。如果你还在纠结于CSS浏览器前缀,其实完全不必纠结了,我们的技术一直在进步中。

随着浏览器的不断更新,无前缀CSS代码得到越来越完整的支持。Chrome 26+,Firefox 16+,Opera 12.10+,IE 10+几乎都已经不再需要CSS前缀了,因为它们支持无前缀的CSS代码。那么,我们现在写的CSS代码,还有没有必要添加对应浏览器的前缀呢?不能说完全没有必要,但是考虑到使用老版本浏览器的用户越来越少,继续维护繁杂的代码确实不值当,所以是时候放弃CSS浏览器前缀(CSS Vendor Prefixes)

未经允许不得转载:天府数据港官方信息博客 » 是时候啦!请放弃CSS浏览器前缀(CSS Vendor Prefixes)吧

客官点个赞呗! (0)
分享到:

评论 抢沙发

评论前必须登录!

天府云博 - 做有态度的开发&运维&设计学习分享平台!

联系我们百度云主机