Come fare per - Visualizza un elemento al passaggio del mouse
Scopri come visualizzare un elemento al passaggio del mouse.
Passa sopra di me.
I am shown when someone hovers over the div above.
Come visualizzare un elemento al passaggio del mouse
Passaggio 1) Aggiungi HTML:
Esempio
<div class="myDIV">Hover over me.</div>
<div class="hide">I am shown when
someone hovers over the div above.</div>
Passaggio 2) Aggiungi CSS:
Esempio
.hide {
display: none;
}
.myDIV:hover + .hide {
display: block;
color: red;
}
Esempio spiegato
Il selettore di fratelli adiacenti ( +
) seleziona tutti gli elementi che sono fratelli adiacenti di un elemento specificato.
La parola "adiacente" significa "segue immediatamente", e l'esempio sopra seleziona tutti gli elementi con class=".hide"
, che sono posizionati immediatamente dopo gli elementi con class=".myDIV
", al passaggio del mouse.
Vai al nostro tutorial sui combinatori CSS per saperne di più sui selettori adiacenti.