Свойство видимости CSS
Пример
Сделайте элементы <h2> видимыми и скрытыми:
h2.a {
visibility: visible;
}
h2.b {
visibility: hidden;
}
Другие примеры «Попробуйте сами» ниже.
Определение и использование
Свойство visibility
указывает, виден ли элемент.
Совет: Скрытые элементы занимают место на странице. Используйте свойство display , чтобы скрыть и удалить элемент из макета документа!
Значение по умолчанию: | видимый |
---|---|
Унаследовано: | да |
Анимация: | да. Читать об анимации |
Версия: | CSS2 |
Синтаксис JavaScript: | объект .style.visibility = "скрытый" |
Поддержка браузера
Цифры в таблице указывают на первую версию браузера, которая полностью поддерживает это свойство.
Property | |||||
---|---|---|---|---|---|
visibility | 1.0 | 4.0 | 1.0 | 1.0 | 4.0 |
Синтаксис CSS
visibility: visible|hidden|collapse|initial|inherit;
Значения свойств
Value | Description | Play it |
---|---|---|
visible | Default value. The element is visible | |
hidden | The element is hidden (but still takes up space) | |
collapse | Only for table rows (<tr>), row groups (<tbody>), columns (<col>),
column groups (<colgroup>). This value removes a row or column,
but it does not affect the table layout. The space taken up by the row or column
will be available for other content. If collapse is used on other elements, it renders as "hidden" |
|
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Дополнительные примеры
Пример
В этом примере показано, как свернуть элемент таблицы:
tr.collapse {
visibility: collapse;
}
Связанные страницы
Учебное пособие по CSS: Отображение и видимость CSS
Справочник по HTML DOM: свойство видимости