Esta tradução está incompleta. Por favor, ajude a traduzir este artigo.

A pseudo-classe CSS :required representa qualquer <input>, <select>, ou <textarea> contendo o atributo required.

/* Seleciona qualquer <input> requerido */
input:required {
  border: 1px dashed red;
}

Esta pseudo-classe é utilizada para destacar campos que devem ter dados válidos antes do formulário ser submetido.

Nota: A pseudo-classe :optional seleciona campos do formulário que são opcionais.

Sintaxe

:required

Exemplos

Veja :invalid como exemplo.

Preocupações com acessibilidade

Elementos <input> obrigatórios devem ter o  atributo required atribuídos. Isso garante que pessoas que navegam com auxílio de recursos de acessibilidade, como o leitor de tela, possam entender quais campos precisam ter conteúdos válidos para garantir a submissão dos dados .

Se o formulário também possui campos opcionais, entradas requeridas devem ser indicadas visualmente usando um tratamento que não seja apenas a cor para passar o significado. Usualmente, textos descritivos e/ou um ícone são utilizados.

Especificações

Especificação Status Comentário
HTML Living Standard
The definition of ':required' in that specification.
Padrão em tempo real Sem mudança.
HTML5
The definition of ':required' in that specification.
Recomendação Define a semântica de validação e de restrição HTML.
Selectors Level 4
The definition of ':required' in that specification.
Rascunho atual Sem mudança.
CSS Basic User Interface Module Level 3
The definition of ':required' in that specification.
Recomendação Define a pseudo-classe, mas não a semântica associada.

Compatibilidade de navegadores

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
Basic supportChrome Full support 10Edge Full support YesFirefox Full support 4IE Full support 10Opera Full support 10Safari Full support 5WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android Full support 4Opera Android Full support 10Safari iOS Full support 5Samsung Internet Android ?

Legend

Full support  
Full support
Compatibility unknown  
Compatibility unknown

Veja também

Etiquetas do documento e colaboradores

Colaboradores desta página: filipe-machado
Última atualização por: filipe-machado,