A visibility tulajdonság
A visibility tulajdonság az elem láthatatlanságát
állítja be. Eközben az összes többi elem
úgy fog viselkedni, mintha az elem sehova
nem tűnt volna el.
Szintaxis
szelektor {
visibility: visible vagy hidden vagy collapse;
}
Értékek
| Érték | Leírás |
|---|---|
visible |
Az elem látható. |
hidden |
Az elem láthatatlanná válik, mintha átlátszó lenne, és eközben továbbra is részt vesz az oldal formázásában. |
collapse |
Ha a collapse értéket táblázat celláinak tartalmára használjuk,
akkor azok mintha eltűnnének, és a táblázat
újraépül.
Ha ezt az értéket nem táblázat sorokra vagy oszlopokra alkalmazzuk, akkor a használatának eredménye ugyanaz lesz, mint a hidden esetén.
|
Alapértelmezett érték: visible.
Példa
Tegyük úgy, hogy az első bekezdés szövege kezdetben
láthatatlan legyen, de amikor a kurzort a 'Show text'
gombra visszük, akkor olvasható legyen:
<button>Show text</button>
<div class="text">text1</div>
<div>text2</div>
div{
border: 1px solid black;
width: 100px;
}
.text {
visibility: hidden;
}
button:hover + .text {
visibility: visible;
}
: