Le :default
pseudo-sélecteur correspondra à la valeur par défaut dans un groupe d'éléments associés, tels que le bouton radio dans un groupe de boutons sélectionné par défaut, même si l'utilisateur a sélectionné une valeur différente.
input(type="radio"):default + label:after ( content: ' (default)'; color: #999; font-style: italic; )
Le CSS ci-dessus cible l'étiquette venant immédiatement après le bouton radio sélectionné par défaut dans un groupe de boutons radio:
- rouge
- vert
- bleu
Le libellé du bouton radio vert sera suivi du texte «(par défaut)» en texte gris et italique dans les navigateurs pris en charge.
- rouge
- vert
- bleu
Les exemples incluent le bouton d'envoi par défaut dans un groupe de boutons, l'option par défaut d'un menu contextuel, le bouton radio dont l' checked
attribut est défini dans le HTML (comme indiqué dans les navigateurs pris en charge) et les cases à cocher cochées par défaut.
Plus de ressources
- Démo
- Page MDN activée: par défaut
- Spécifications de l'interface utilisateur W3C CSS3
- Sélecteurs W3C Niveau 4
Prise en charge du navigateur
Différents navigateurs ont différents niveaux de support. Firefox fournit un support complet. Les navigateurs Webkit prennent en charge la valeur par défaut sur les boutons mais pas sur la radio ou les cases à cocher, et Opera est l'inverse, le prenant en charge sur les boutons radio et les cases à cocher, mais pas lors de l'envoi.
- Opera prend
:default
en charge les cases à cocher et les boutons radio. - Les navigateurs Webkit, y compris Chrome et Safari, prennent
:default
en charge le bouton d'envoi - Firefox prend
:default
en charge les types d'entrée à case à cocher, radio ET soumission. - Internet Explorer ne prend pas en charge
:default
les types de case à cocher, de radio ou d'envoi.
Chrome | Safari | Firefox | Opéra | C'EST À DIRE | Android | iOS |
---|---|---|---|---|---|---|
dix | 5 | 4 | dix | rien | rien | 5 |