css自动前缀_CSS创意：/ *自动前缀* /

css自动前缀

Using utilities likes SASS and Compass have made me me think a lot about how we can improve CSS in the short term.  Of course all CSS proposals should go through the W3C standardization process, but the problem is that those processes take a long time.  We also know that there are a lot of things we know we need in CSS:

使用诸如SASS和Compass之类的实用程序让我思考了一下如何在短期内改进CSS。 当然，所有CSS提案都应经过W3C标准化过程，但问题是这些过程需要很长时间。 我们还知道CSS中有很多我们需要的东西：

• CSS Variables
  CSS变量
• Nested style blocks (a la SASS, LESS, etc.)
  嵌套样式块(如SASS，LESS等)
• Macros / routines
  宏/例程

We know we need these things but still don't have them yet, and likely wont for years.  That got me to thinking about another problem:  the constant need to do the prefixing of properties for every browser, like this mess:

我们知道我们需要这些东西，但仍然还没有，而且可能多年都不会。 那让我开始思考另一个问题：不断需要为每个浏览器做属性前缀，就像这样：

#someElement {
	-moz-animation-name: myAnimation;
	-webkit-animation-name: myAnimation;
	-ms-animation-name: myAnimation;
	animation-name: myAnimation;
}

Firefox has un-prefixed a majority of previously prefixed properties, but we still can't get away from this mess for other browsers.  So how can we fix this in the short term, besides making browser vendors unprefix?  One idea is doing something kind of like JavaScript's use strict;  we start our CSS file with something like this comment:

Firefox取消了大多数先前带前缀的属性的前缀，但是对于其他浏览器，我们仍然无法摆脱这种混乱局面。 那么，除了让浏览器供应商取消前缀之外，我们如何在短期内解决此问题？ 一种想法是做一些有点像 JavaScript的use strict ; 我们以如下注释开始CSS文件：

/*autoprefix*/



/* and then somewhere in the CSS file */
#someElement {
	animation-name: myAnimation;
}

If a CSS file started with this CSS comment, the browser would automatically prefix properties that required prefixing.  Since browsers know which properties need prefixing, and they only need to account for their prefix, this type of system would reduce code (and thus smaller/quicker file downloads) and, in theory, be much faster to implement.

如果CSS文件以该CSS注释开头，则浏览器将自动为需要添加前缀的属性添加前缀。 由于浏览器知道哪些属性需要加前缀，并且它们只需要考虑其前缀，因此这种类型的系统将减少代码(从而减少文件下载量/缩短文件下载时间)，并且从理论上讲，实现起来要快得多。

Now this isn't a perfect solution by any means.  It should still be standardized at some point and unfortunately some prefixed properties act differently than unprefixed.  Just a thought that I wanted to share, get some feedback on.  Let me know if you think something like this would work!

现在无论如何这都不是完美的解决方案。 仍应在某些时候对其进行标准化，但不幸的是，某些带前缀的属性的行为与未带前缀的属性不同。 只是我想分享的想法，请提供一些反馈。 让我知道您是否认为这样的工作会成功！

翻译自: https://davidwalsh.name/css-idea-autoprefix

css自动前缀