Pseudo-classe :focus-within CSS

Definizione e utilizzo

CSS :focus-within Le pseudo-classe vengono utilizzate per abbinare un elemento, se l'elemento o uno dei suoi discendenti qualsiasi ottiene il fuoco.

Esempio

Quando un campo del modulo ottiene il fuoco, seleziona e imposta lo stile del modulo:

form:focus-within {
  border: 2px solid nero;
  background-color: beige;
  color: nero;
}

Prova da solo

Sintassi CSS

:focus-within {
  dichiarazioni css;
}

Dettagli tecnici

Versione: CSS4

Supporto del browser

I numeri nella tabella indicano la versione del browser che supporta completamente la pseudo-classe.

Chrome Edge Firefox Safari Opera
60 79 52 10.1 47

Pagine correlate

Guida:CSS Pseudo-classe

Riferimento:Pseudo-classe CSS :focus