Come mostrare un elemento quando il mouse è sopra

Impara a mostrare un elemento quando il mouse è sopra.

Metti il mouse sopra di me.
Quando qualcuno mette il mouse sopra il div sopra, me lo mostrerò.

Come mostrare un elemento quando il mouse è sopra

Primo passo - Aggiungi HTML:

<div class="myDIV">Metti il mouse sopra di me.</div>
<div class="hide">Quando qualcuno mette il mouse sopra il div sopra, me lo mostrerò.</div>

Secondo passo - Aggiungi CSS:

.hide {
  display: none;
}
.myDIV:hover + .hide {
  display: block;
  color: red;
}

Prova a farlo tu stesso

Esempio di spiegazione:

Sceltatore adiacente di livello同级选择器 (+) Seleziona tutti gli elementi adiacenti all'elemento specificato.

Il termine "adiacente" significa "seguito da", l'esempio sopra seleziona tutti gli elementi con class=".hide" Gli elementi, questi elementi vengono posizionati immediatamente dopo l'elemento con il mouse sopra, seguendo l'elemento con class=".myDIV" dopo l'elemento.

Pagine correlate

Tutorial:Combinatore CSS