Miten näyttää elementti hiiren oltua päällä

Opeta näyttämään elementti hiiren oltua päällä

Liikuta hiirtä päälleni.
Kun joku liikuttaa hiirtä yllä olevan div:n päällä, se näkyy minulle.

Miten näyttää elementti hiiren oltua päällä

Vaihe 1 - Lisää HTML:

<div class="myDIV">Liikuta hiirtä päälleni.</div>
<div class="hide">Kun joku liikuttaa hiirtä yllä olevan div:n päällä, se näkyy minulle.</div>

Vaihe 2 - Lisää CSS:

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

Kokeile itse

Esimerkki selityksestä:

Peräkkäinen tasoryhmävalitsin (+) Valitaan kaikki elementit, jotka ovat peräkkäisiä määritetyllä elementillä.

"Peräkkäinen" tarkoittaa "Seuraavaksi", esimerkissä valitaan kaikki elementit, joilla on class=".hide" Elementin, jotka sijoitetaan紧接着带有 class=".myDIV" elementin jälkeen.

Liittyvät sivut

Oppitunnit:CSS-yhdistäjä