-moz、-ms-、-o-、-webkit- 浏览器前缀分别是那些浏览器,以及它们的缘由

首先解释这些前缀分别是那些浏览器的

-ms-      IE
-o-       Opera
-webkit-  Chrome、Safari
-moz-     Firefox

再来解释一下为什么会出现这些前缀(参考《CSS揭秘》这本书)

        在标准制定过程中,,标准制定工作组需要站在开发者角度输入,但是他们往往没有兴趣尝试那些在生产环境中还不能正常使用的东西。然后为了解决这个问题,提出了许多方案,浏览器前缀就是其中之一。

       浏览器前缀这个方案是指每个浏览器都可实现这些实验性的特性的特性,但是要在名称前面加上自己特有的前缀的特性,并把使用结果反馈给标准制定工作组。听起来不错,但是当开发者发现加了前缀就可以轻易是现在之前大费周章才能实现的效果,他们就开始滥用了。很快浏览器前缀就成为了一种潮流。不久,开发者发现如果只写出当下支持的浏览器的前缀,之后就要不停的来打补丁,聪明的开发者们就尽可能多的加上所有前缀,并将不带前缀的版本放在最后(css的层叠原理),这就有了以下有名又常见的代码:

-moz-border-radius: 10px;
-ms-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
border-radius: 10px;

可以看到,把每个声明都重复五遍是很枯燥无聊的,所以就有了自动化的工具出现

  • 像CSS3, Please!和pleeease,这样的网站允许你把无前缀的代码粘贴进去,它们自动的帮你把前缀加好。但是很快过气了。
  • Autoprefixer  采用Can I Use的数据库来判断那些前缀需要添加,此外它是在本地完成编译的,类似预处理器。
  • -prefix-free 会在浏览器中进行检测特性分析,来决定那些前缀需要添加。
  • 像stylus、scss、less、sass的预处理器不需要添加前缀。

浏览器前缀已经是一场史诗般的失败,现在浏览器厂商已经很少使用前缀的方式来实验性的实现新特性了。取而代之,这些实验特性需要通过配置开关来启用。

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值