Jak na to – Zobrazte prvek při najetí myší
Přečtěte si, jak zobrazit prvek při umístění kurzoru myši.
Najeďte nade mnou.
I am shown when someone hovers over the div above.
Jak zobrazit prvek při najetí myší
Krok 1) Přidejte HTML:
Příklad
<div class="myDIV">Hover over me.</div>
<div class="hide">I am shown when
someone hovers over the div above.</div>
Krok 2) Přidejte CSS:
Příklad
.hide {
display: none;
}
.myDIV:hover + .hide {
display: block;
color: red;
}
Příklad vysvětlen
Selektor sousedících sourozenců ( +
) vybere všechny prvky, které jsou sousedními sourozenci zadaného prvku.
Slovo „sousední“ znamená „bezprostředně následuje“ a výše uvedený příklad vybírá všechny prvky s class=".hide"
, které jsou umístěny bezprostředně za prvky s class=".myDIV
„, na ukazatel myši.
Další informace o sousedních selektorech naleznete v našem výukovém programu CSS Combinators .