1. 首页
  2. css

CSS如何处理供应商前缀

如果您编写CSS,您几乎肯定需要在您编写的代码的某些部分使用供应商前缀,以确保最佳的浏览器支持。无论是带前缀的属性(如-prefix transform)、带前缀的规则(如@-prefix keyframes)还是带前缀的值(如-prefix linear gradient),它都是CSS作者的日常琐事。
它不仅是我们工作的一部分,而且很容易搞糟。我最近看了一大堆大网站,专门寻找一些挑剔的CSS3错误,我能在任何一个网站上找到一个。那么我们如何编写CSS,以便始终使用正确的前缀呢?
Hand Author–请参阅css3。Hand authoring意思是您的站点在生产中使用的CSS(\”live\”)是您在文本编辑器中编辑自己的CSS文件。走这条路意味着您需要在自己编写的文件中包含所有正确的供应商前缀。有点乏味和错误容易为我喜欢,但可能的情况下,大多数网站在世界上。
如果您的情况是这样的,那么最好是引用最新的资源,如CSS3!。您可以在该站点上编辑值,并将其复制粘贴到您自己的样式表中。
如果您这样做,则意味着您有责任保持最新。前缀没有以前那么容易变化,但是每隔几个月看一次肯定是有必要的。
Hand Author–Don\”t Prefix–Let-Prefix free do it client side
您仍然手工编写CSS,但是您只使用无前缀的属性/值/at规则。-prefixfree是一种JavaScript,它可以运行、查看所有的CSS,并在必要时使用使这些样式正常工作所需的适当前缀将新样式附加到页面。这是神圣的战争领土。它使CSS文件更小!是的,但它有危险的联合国-CSS3\”d元素闪烁!它需要JavaScript的风格,跨越流!是的,但是只有2公里!当浏览器不再需要它的时候,它就会停止前缀的添加,这是它最好的进步!
由您决定。
还值得注意的是,jQuery的.css()方法将为您做一些前缀。我不喜欢通过JavaScript应用CSS,但很高兴知道规则总是有例外。
正在部署。它基本上解析您的CSS,找到需要前缀的东西,并为您做它。
它非常聪明,因为您不必使用特别没有前缀的CSS(比如-prefix free requires)。例如,如果您恰好缺少所需的三个前缀中的一个,它将看到这一点,并且只添加缺少的一个。

如果你使用Sass,Compass或Bourbon有一套强大的CSS3混合物供你使用。
如果你使用较少,我有一套,或者你可以看看这篇综述,比较一下其他的。手写作者–不要加前缀–用Autoprefixer进行后期处理
这是一个非常好的方法。这一切都在本文中列出了。实际上,您只是忘记了前缀,这个构建步骤将根据CanIUse提供的最新和最好的信息为您添加前缀。\”不要\”
我有时看到的一个错误是,人们只是在每个CSS3属性上使用所有主要前缀。似乎他们有一个通用的混合,他们只是把所有的东西,通过拍打前缀。如果你见过像-o-border-radius这样的东西,那就是我的意思。这从来就不存在,也不需要进入你的CSS。
另一个错误是让CSS变得过时。正如我前面提到的,值得一看比几个月还老的CSS,以确保它是符合标准的。如果你在这个网站上看到任何过时的东西,请告诉我,我会马上更新

CSS如何处理供应商前缀 为WP2原创文章,链接:https://www.wp2.cn/css/css%e5%a6%82%e4%bd%95%e5%a4%84%e7%90%86%e4%be%9b%e5%ba%94%e5%95%86%e5%89%8d%e7%bc%80/