Manuale di riferimento CSS

Regole @CSS (RULES)

Completo delle proprietà CSS

Funzioni CSS Manuale completo dei selettori CSS

Selettore :focus CSS

La pseudo-classe CSS :focus rappresenta l'elemento che ottiene il focus (ad esempio, un campo di input del modulo). Viene attivata quando l'utente clicca o tocca l'elemento o lo seleziona tramite la tastiera con il tasto "tab".

Manuale di riferimento completo delle scelte CSS

Esempio online

Stile selezionato quando un campo di input ottiene il focus:

Esempio

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">　
<title> Tutorial di base (oldtoolbag.com) </title>　
<style>
input:focus
{
　　　　background-color:orange;
}
</style>
</head>
<body>
<p>Cliccando nel campo di testo del modulo si può vedere lo sfondo giallo:</p>
<form>
Nome:　<input　type="text"　name="firstname"　/><br>
Cognome:　<input　type="text"　name="lastname"　/>
</form>
<p><b>Attenzione:</b>　:focus　funziona su IE8, il DOCTYPE deve essere dichiarato</p>
</body>
</html>

Prova a vedere ‹/›

Definizione e uso

Il selettore :focus viene utilizzato per selezionare gli elementi con il focus.

Suggerimento: Il selettore :focus accetta eventi di tastiera o altri elementi di input utente.

Compatibilità del browser

I numeri nella tabella rappresentano la versione del browser che supporta l'attributo per la prima volta.

Selettore
:focus	4.0	8.0	2.0	3.1	9.6

Attenzione: 　Il selettore :focus deve essere dichiarato in IE8<!DOCTYPE> .