Свойство visibility
Свойство visibility задава невидимост
на елемент. При това всички останали елементи
ще се държат така, сякаш елементът никъде
не е изчезнал.
Синтаксис
селектор {
visibility: visible или hidden или collapse;
}
Стойности
| Стойност | Описание |
|---|---|
visible |
Елементът е видим. |
hidden |
Елементът става невидим, сякаш прозрачен и при това продължава да участва във форматирането на страницата. |
collapse |
Ако използвате collapse за съдържанието на таблични клетки,
те сякаш изчезват, а таблицата
се престроява наново.
Ако тази стойност се прилага не към редове или колони на таблица, то резултатът от нейната употреба ще бъде същият като hidden.
|
Стойност по подразбиране: visible.
Пример
Нека направим така, че текстът на първия параграф първоначално
да е невидим, но при посочване на курсора върху бутона
'Show text' да можем да го прочетем:
<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;
}
:
