La pseudo-classe :default représente un élément de l'interface utilisateur qui est l'élément par défaut parmi d'autres éléments semblables (par exemple le bouton par défaut d'un groupe de boutons).

Ce sélecteur peut être utilisé sur des éléments <button>, <input type="checkbox">, <input type="radio"> et <option>.

/* Cible l'élément par défaut d'un groupe */
:default {
  background-color: lime;
}

Ainsi, le bouton actionné par défaut parmi plusieurs boutons pourra être mis en forme en le ciblant avec cette pseudo-classe.

Les éléments de l'interface utilisateur qui permette une sélection multiple peuvent avoir plusieurs éléments par défaut. Dans ce cas, tous les éléments par défaut sont ciblés via la pseudo-classe :default.

Syntaxe

:default

Exemples

CSS

:default
{
  background-color: lime;
}

HTML

<input type="radio" name="saison" id="printemps">
<label for="printemps">Printemps</label>

<input type="radio" name="saison" id="ete" checked>
<label for="ete">Été</label>

<input type="radio" name="saison" id="automne">
<label for="automne">Automne</label>

<input type="radio" name="saison" id="hiver">
<label for="hiver">Hiver</label>

Résultat

Spécifications

Spécification État Commentaires
HTML Living Standard
La définition de ':default' dans cette spécification.
Standard évolutif Aucune modification.
HTML5
La définition de ':default' dans cette spécification.
Recommendation La sémantique liée au HTML est définie et les contraintes de validation sont également définies.
Selectors Level 4
La définition de ':default' dans cette spécification.
Version de travail Aucune modification.
CSS Basic User Interface Module Level 3
La définition de ':default' dans cette spécification.
Recommendation Définition initiale de la pseudo-classe mais pas de la sémantique associée.

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidEdge MobileFirefox pour AndroidOpera pour AndroidSafari sur iOSSamsung Internet
Support simpleChrome Support complet 10Edge ? Firefox Support complet 4IE Aucun support NonOpera Support complet 10Safari Support complet 5WebView Android ? Chrome Android ? Edge Mobile ? Firefox Android Support complet 4Opera Android Support complet 10Safari iOS Support complet 5Samsung Internet Android ?

Légende

Support complet  
Support complet
Aucun support  
Aucun support
Compatibilité inconnue  
Compatibilité inconnue

Étiquettes et contributeurs liés au document

Étiquettes : 
Contributeurs à cette page : SphinxKnight, teoli, tregagnon, FredB, Mgjbot, BenoitL
Dernière mise à jour par : SphinxKnight,