De :defaultpseudo-selector komt overeen met de standaardwaarde in een groep gekoppelde elementen, zoals het keuzerondje in een groep knoppen die standaard is geselecteerd, zelfs als de gebruiker een andere waarde heeft geselecteerd.
input(type="radio"):default + label:after ( content: ' (default)'; color: #999; font-style: italic; )De CSS hierboven richt zich op het label dat direct na het standaard geselecteerde keuzerondje in een groep keuzerondjes komt:
- rood
- groen
- blauw
Het label van het groene keuzerondje wordt gevolgd door de tekst “(standaard)” in grijze, cursieve tekst in ondersteunende browsers.
- rood
- groen
- blauw
Voorbeelden zijn de standaard verzendknop in een groep knoppen, de standaardoptie uit een pop-upmenu, het keuzerondje waarvan het checkedattribuut is ingesteld in de HTML (zoals te zien is in ondersteunende browsers) en de selectievakjes die standaard zijn aangevinkt.
Meer middelen
- Demo
- MDN-pagina aan: standaard
- W3C CSS3 UI-specificaties
- W3C-keuzeschakelaars niveau 4
Browser-ondersteuning
Verschillende browsers hebben verschillende ondersteuningsniveaus. Firefox biedt volledige ondersteuning. Webkit-browsers ondersteunen standaard op knoppen maar niet op radio of selectievakjes, en Opera is het omgekeerde en ondersteunt het op keuzerondjes en selectievakjes, maar niet op de submap.
- Opera ondersteunt
:defaultselectievakjes en keuzerondjes. - Webkit-browsers, waaronder Chrome en Safari, ondersteunen
:defaultop de verzendknop - Firefox ondersteunt
:defaultselectievakjes, radio EN invoertypes. - Internet Explorer ondersteunt geen
:defaultselectievakjes, radio of invoertypes.
| Chrome | Safari | Firefox | Opera | D.W.Z | Android | iOS |
|---|---|---|---|---|---|---|
| 10 | 5 | 4 | 10 | geen | geen | 5 |