W3C home > Mailing lists > Public > www-style@w3.org > February 2008

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

From: Alan Gresley <alan1@azzurum.com>
Date: Wed, 06 Feb 2008 12:31:16 -0700
To: www-style@w3.org
Message-ID: <20080206123116.34b83c2f3c9bef00757a2c62c0fb7450.067e6b9401.wbe@email.secureserver.net>

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).


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>.


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

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:27:33 UTC