est ce qu'on utilise ces crochets [] dans les css

[Mado]

bonjour

toute la question est dans le titre

merci

marie

[LaurentDenis]

Les crochets [] permettent de "cibler" un sélecteur sur un élément doté d'un attribut donné, ou même plus précisément selon la valeur de cet attribut.

Un exemple classique d'utilisation : générer en CSS la mention de la langue du document cible d'un lien

<a href="..." hreflang="en">...</a>
<a href="...">...</a>

Le premier lien pointe vers un document en anglais, ce que signale son attribut hreflang.

Avec la règle CSS :

a[hreflang]:after {

content: "\00A0(" attr(hreflang) ") "

}

... on sélectionne tous les liens ayant un attribut hreflang pour afficher à la suite le contene de l'attribut, ce qui donnera (en) pour notre lien en anglais. (le \00A0 est un simple espace insécable).

Avec la règle CSS :

a[hreflang=en]:after {

content: "\00A0(en anglais) "

}

... on ne sélectionne que les liens ayant un attributs hreflang avec la valeur "en", pour afficher à la suite la mention (en anglais)

Dans les deux cas, le second lien ci-dessus, qui n'a pas d'attribut hreflang, ne sera pas concerné.

Ce type de sélecteur rend également bien service pour différencier les éléments input selon leur type quand on style un formulaire...

J'oubliais : ça ne marche pas dans IE Win, et peu de navigateur supportent des opérateurs plus complexes que le simple =

Modifié 15 Septembre 2004 par LaurentDenis