O :default
pseudo seletor corresponderá ao padrão em um grupo de elementos associados, como o botão de opção em um grupo de botões que é selecionado por padrão, mesmo se o usuário tiver selecionado um valor diferente.
input(type="radio"):default + label:after ( content: ' (default)'; color: #999; font-style: italic; )
O CSS acima direciona o rótulo que vem imediatamente após o botão de opção selecionado padrão em um grupo de botões de opção:
- vermelho
- verde
- azul
O rótulo do botão de opção verde será seguido pelo texto “(padrão)” em texto cinza e itálico em navegadores compatíveis.
- vermelho
- verde
- azul
Os exemplos incluem o botão de envio padrão em um grupo de botões, a opção padrão de um menu pop-up, o botão de rádio que tem o checked
atributo definido no HTML (como visto em navegadores de suporte) e as caixas de seleção que são marcadas por padrão.
Mais recursos
- Demo
- Página MDN em: padrão
- Especificações W3C CSS3 UI
- Seletores W3C de nível 4
Suporte para navegador
Navegadores diferentes têm diferentes níveis de suporte. O Firefox oferece suporte completo. Os navegadores Webkit oferecem suporte a botões de opção, mas não ao rádio ou caixas de seleção, e o Opera é o inverso, oferecendo suporte a botões de rádio e caixas de seleção, mas não no envio.
- O Opera oferece suporte
:default
para caixas de seleção e botões de rádio. - Navegadores Webkit, incluindo Chrome e Safari, oferecem suporte
:default
no botão de envio - O Firefox suporta
:default
caixa de seleção, rádio e tipos de entrada de envio. - O Internet Explorer não é compatível
:default
com caixa de seleção, rádio ou tipos de entrada de envio.
cromada | Safári | Raposa de fogo | Ópera | IE | Android | iOS |
---|---|---|---|---|---|---|
10 | 5 | 4 | 10 | Nenhum | Nenhum | 5 |