Pseudo-classe :focus-within do CSS

Definição e Uso

CSS :focus-within O pseudo-classe é usado para coincidir com um elemento, se esse elemento ou qualquer descendente dele ganhar foco.

Exemplo

Quando um campo do formulário ganha foco, selecione e defina o estilo do formulário:

form:focus-within {
  borda: 2px sólida preto;
  cor-fundo: bege;
  cor: preto;
}

Experimente você mesmo

Sintaxe CSS

:focus-within {
  declarações css;
}

Detalhes Técnicos

Suporte do Navegador

Os números na tabela indicam a primeira versão do navegador que suporta completamente esse seletor pseudo.

Páginas Relacionadas

Tutorial：Seletor Pseudo

Referência：Pseudo-classe :focus do CSS