Re: [CSS Variables] WebKit now supports variable declaration blocks

On Aug 22, 2008, at 10:16 AM, François REMY wrote:

> But for complex variables, I suggest the use of a "extends" property.
>
> @define {
>   bigText {
>       font-size: 150%
>       font-weight: bolder;
>       color: black !important;
>   };
> }
>
> h1.bigText {
>   font-size: 15pt;
>   extends: $bigText;
>   color: blue;
> }
>
> Computed values of a "h1.bigText" with no style : {
>   font-size: 15pt; /* the h1.bigText rule have more importance than  
> the extended one */
>   font-weight: bolder; /* this is the only one rule */
>   color: black; /* the rule that have !important have more important  
> than the others */
> }
>

I don't see why you would need "extends". The var(varname) or $varname  
should just expand to the same as if you actually typed in all the  
properties yourself. So if you wanted that computed value, you would  
write it like this:

h1.bigText {
   $bigText;
   font-size: 15pt;
   color: blue;
}

and that would be the same as if you typed this:

h1.bigText {
   font-size: 150%
   font-weight: bolder;
   color: black !important;
   font-size: 15pt;  /* supersedes earlier font-size */
   color: blue; /* ignored because of !important */
}