RE: [css3] Suggestion: Selector variables or "synonyms"

Jens Meiert" wrote:

> The basic idea is to syntactically allow definitions like
>
> E = F;
>
> ... so that rules matching E would match F as well (and the other way around), while variable (or synonym)
> declarations could probably be located at the beginning of a style sheet or within a certain @-rule.


At first though I could see

E = F; F = D; D = E;

which looks quite scary.


> A more advanced step allowing for even more benefits is to allow selector grouping and a specific placeholder syntax as well, as in
>
> E = F, G;
> @H = I;
>
> ... where @H wouldn't mean a "regular" selector but a "placeholder" only viable in style sheets and requiring
> a "regular" selector equivalent.


I don't quite understand this.


[...]
> Extensive use of contextual selectors and/or long ID and class names usually resulting in less clear style sheets might be avoided by selector variables.
>
> Example: "@foo = #navigation li a"
>
> * Improved CSS efficiency:
>
> Not talking about possible compression tools, style sheet size might easily be decreased by "compressing"
> long selectors through variables - without style sheets necessarily getting less readable or
> understandable.
> --
> Jens Meiert
> http://meiert.com/en/


This I follow, an example:

@rule #navigation {
ul { list-style: none }
li { list-style: none; float: left; }
a { display: block; width: 7em; }
/* etc */
}


The following menu (server seems to be down at this moment).

http://css-class.com/articles/ursidae/bears5ddh-kbaccess.htm

has #navigation repeated about 40 times in the embedded CSS. I really should have the ID on the wrapper div instead of the initial <ul>. Then I could have.

@rule #navigation = (nav) {
ul { list-style: none }
li { list-style: none; float: left; }
a { display: block; width: 7em; }
/* etc */
}

since <nav> is a new element proposed in HTML 5, I could style older pages with the element <div id="navigation"> and newer pages with the element <nav>.


Alan

http://css-class.com/

Received on Wednesday, 6 February 2008 19:31:41 UTC