CSS :focus Pseudo-Klasse

Definition und Verwendung

CSS :focus Pseudo-Klassen werden verwendet, um das Stil des fokussierten Elements auszuwählen und zu setzen.

Beispiel

Beispiel 1

Wählen und stellen Sie das Stil des fokussierten Eingabefelds ein:

input:focus {
  background-color: yellow;
}

Probieren Sie es selbst aus

Beispiel 2

Wenn das Eingabefeld fokussiert wird, ändern Sie die Hintergrundfarbe und die Breite:

input:focus {
  background-color: yellow;
  width: 250px;
}

Probieren Sie es selbst aus

CSS-Syntax

:focus {
  css-Anweisungen;
}

Technische Details

Browser-Unterstützung

Die Zahlen in der Tabelle geben die erste Browserversion an, die den Pseudo-Typ vollständig unterstützt.

Verwandte Seiten

Lehrvideo:CSS Pseudo-Klasse