Sélecteurs et CSS3

Ahh, les feuilles de style de niveau 3… La majorité d’entre nous piaffe d’impatience dans l’attente de leur passage en tant que recommandation officielle du W3C. Malheureusement, il reste encore beaucoup de travail et ce n’est donc pas pour tout de suite, et je ne parle même pas après cela de leur intégration rapide dans les navigateurs (suivez mon regard).

Par chance, il existe un navigateur à la pointe du respect des standards, et qui a même déja intégré quelques fonctionnalités des CSS3, ce qui me permet d’en profiter honteusement, quitte à ce que mes feuilles de style ne soient pas valides. Ce navigateur, vous l’aurez deviné, est Mozilla.

Parmi ces possibilités offertes en prime-time, on trouve les sélecteurs. Cette partie des CSS3 est à l’état de Candidate Recommendation, ce qui signifie qu’on peut considérer son contenu comme définitif. Ce qui m’interesse en l’occurence, ce sont les nouvelles possibilités offertes avec le sélecteur d’attribut. On connaissait déja les sélecteurs d’attribut : E[foo] pour cibler un élément E ayant un attribut foo, [att~=val] et [att|=val] (personnellement, je n’ai jamais trouvé ces deux là très utiles dans le contexte d’un document (X)HTML). Avec les CSS3, nous en aurons quelques uns de plus, et franchement plus utiles : Substring matching attribute selectors (je trouve pas la bonne traduction). Je vous invite à aller lire le lien donné, mais en gros, il sera possible de cibler un élément dont l’attribut att commence par une valeur val, contient la valeur val (sans besoin de séparation par des espaces ou autre) ou se termine par une valeur val. J’utilise déja ces possibilités dans ma feuille de style de base, pour ajouter l’icône d’enveloppe après un lien vers une adresse en mailto et ajouter une icône de dossier zip après les liens pointant sur une archive zip :

a[href^="mailto:"]:after  { content: " " url("/Icones/email"); }
a[type$="zip"]:after      { content: " " url("/Icones/zip"); }

Franchement excellent, et je regrette presque qu’ils ne soient pas allés plus loin dans l’utilisation des expressions régulières, enfin il est vrai qu’il faut bien trouver une juste limite entre l’ajout de possibilité et le besoin de garder un fonctionnement relativement simple des feuilles de style.