Les Variables de plus en plus proches du CSSWebKit commence à les supporter de manière expérimentale
L’équipe de WebKit, le moteur de rendu utilisé entre autres par Chrome et Safari, va supporter de manière expérimentale une des avancées les plus attendues (et fondamentales ?) du CSS : les variables.
Jusqu’ici, seules des alternatives (comme less.js) permettaient d’utiliser ces variables dans des feuilles de style. Problème, ces « tours de passe-passe » demandent une phase de compilation.
La solution du W3C, qui sera donc très prochainement supportée par le build Canary de Chrome et plus largement par les Nightly Builds de Webkit, est beaucoup plus simple.
Elle consiste à définir une variable comme suit :
| Code : | Sélectionner tout |
1 2 3 | :root {
var-header-color: #06c;
} |
| Code : | Sélectionner tout |
h1 { background-color: var(header-color); }
| Code : | Sélectionner tout |
1 2 | one { var-foo: 10px; }
two { var-bar: calc(var(foo) + 10px); } |
| Code : | Sélectionner tout |
1 2 3 4 | :root { var-color: blue; }
div { var-color: green; }
#alert { var-color: red; }
* { color: var(color); } |
| Code : | Sélectionner tout |
1 2 3 4 5 6 | <p>I inherited blue from the root element!</p> <div>I got green set directly on me!</div> <div id='alert'> While I got red set directly on me! <p>I'm red too, because of inheritance!</p> </div> |
Une des applications indirectes de ces « var » - si elles viennent à être supportées par Gecko (Firefox), Trident (IE) et Presto (Opera) - sera de discriminer de fait les navigateurs les plus récents des autres.
Une manière plus pérenne et économique que l’instauration d’une taxe (comme celle lancée par un site australien sur IE7) pour faire migrer les utilisateurs ?
Les Nightly Builds de WebKit sont disponibles sur cette page
Plus d’informations sur le build Canary de ChromeSource : WebKit
Et vous ?
Impatient(e) d’utiliser les variables directement dans du CSS ? Ou pas du tout ? Et pourquoi ?
Vous avez lu gratuitement 4 875 articles depuis plus d'un an.
Soutenez le club developpez.com en souscrivant un abonnement pour que nous puissions continuer à vous proposer des publications.
Soutenez le club developpez.com en souscrivant un abonnement pour que nous puissions continuer à vous proposer des publications.

