Are CSS variables implemented in any modern browser? [closed]
I found this W3C proposal for CSS variables and was wondering if any modern browsers (i.e. IE7+, Firefox 5+, Chrome) implement them yet?
As of this week, WebKit -- which is used by Safari and Chrome -- will be working to implement CSS variables.
http://trac.webkit.org/changeset/120154
https://developer.mozilla.org/en/CSS_Reference
This is a reference to MDN - they do a pretty good job of listing known browser compatibility. What is/isn't possible is going to be dependent upon each individual css rule. The world of web development would be a lot easier if everything followed the specs perfectly; but that is rarely the case. The @variables rule you referenced isn't listed there, so I'm guessing you're out of luck. Though there are a lot of mobile browsers coming out as people keep buying newer phones - so you might find somewhere that can use this out in the wild world of mobile browsers.
I don't know of any browser that uses CSS variables like that. The W3C document you linked was only a proposal, not a standard. Even stanards take a while to get full support in browsers, so I'd imagine widespread implementation is a ways off regardless.
If you want that sort of functionality though, you can look into something like LESS or Sass.
Variables are listed as "working draft" in CSS3, or "exploring phase" which means there is no agreement how best to implement it, or even if it should be.
Browser support will be constantly a moving target so the answer "No" is difficult to stake and still be accurate when you read this. Variables aren't even listed on most browser comparison charts (March 2012)
This is not standard in most browser rendering of CSS, it may be part of a working group for the css3 spec though I do not believe I have seen mention of it previously.
It is possible to achieve this kind of effect with the addition of other libraries, the one I am most familiar with is called less CSS which supports some cool stuff like variables and nesting rules but it works by translating that to long form CSS.
精彩评论