Lastnost visibility
Lastnost visibility določa nevidnost
elementu. Pri tem se bodo vsi ostali elementi
obnašali tako, kot da element nikamor
ni izginil.
Sintaksa
selektor {
visibility: visible ali hidden ali collapse;
}
Vrednosti
| Vrednost | Opis |
|---|---|
visible |
Element je viden. |
hidden |
Element postane neviden, kot da je prozoren, in pri tem še naprej sodeluje pri oblikovanju strani. |
collapse |
Če uporabimo collapse za vsebino celic tabel,
potem te kot da izginejo, tabela pa se
preoblikuje na novo.
Če se ta vrednost uporablja ne za vrstice ali stolpce tabele, bo rezultat njene uporabe enak kot hidden.
|
Privzeta vrednost: visible.
Primer
Naredimo tako, da je besedilo prvega odstavka sprva
nevideno, toda pri premikanju kazalca na gumb
'Pokaži besedilo' ga lahko preberemo:
<button>Pokaži besedilo</button>
<div class="text">besedilo1</div>
<div>besedilo2</div>
div{
border: 1px solid black;
width: 100px;
}
.text {
visibility: hidden;
}
button:hover + .text {
visibility: visible;
}
: