Litra Library
Главная » Статьи » WEB » Свойства CSS
VISIBILITY
Браузер Internet Explorer Firefox Mozilla Opera Netscape Safari
Версия 5.5 6.0 7.0 1.0 2.0 1.7 7.0 8.0 9.0 6.0 7.0 8.0 1.0
Поддержка Част. Част. Част. Поддерживается Поддерживается Поддерживается Поддерживается Поддерживается Поддерживается Поддерживается Част. Поддерживается Поддерживается

Част. - поддерживается частично.

Краткая информация

CSS CSS2
Значение по умолчанию visible
Наследование Да
Применяется Ко всем элементам
Аналог HTML Нет
Ссылка на спецификацию http://www.w3.org/TR/CSS21/visufx.html#propdef-visibility

Описание

Данное свойство служит для соскрытия или показа элемента. Скрывая элемент, он становится не видимым, но занимаемое место. Тоже самое свойство у элемента display:none, только последний скрывает совсем элемент и не занимает место Если предполагается вывод разных элементов в одно и то же место экрана, для обхода этой особенности следует использовать абсолютное позиционирование или воспользоваться свойством display.

Синтаксис

visibility: visible | hidden | collapse

Аргументы

visible Отображает элемент как видимый.
hidden Элемент становится невидимым или правильней сказать, полностью прозрачным, поскольку он продолжает участвовать в форматировании страницы.
collapse Если это значение применяется не к строкам или колонкам таблицы, то результат его использования будет таким же, как hidden. В случае использования collapse для содержимого ячеек таблиц, то они реагируют, словно к ним было добавлено стилевое свойство display: none. То есть, заданные строки и колонки убираются, а таблица перестраивается по новой. Этот аргумент не поддерживается браузером Internet Explorer.

Пример

Валидный CSS<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>visibility</title>
<script type="text/javascript">

function hiddenLayer() {
document.getElementById("descr").style.visibility = "hidden";
}

function showLayer() {
document.getElementById("descr").style.visibility = "visible";
}
</script>
</head>
<body>

<p><a href="#" onMouseOver="showLayer()" onMouseOut="hiddenLayer()"><img src="button.gif" width="98" height="33" alt="Кнопка"></a></p>
<div id="descr" style="visibility: hidden">Все счастливые семьи похожи друг на друга, каждая несчастливая семья несчастлива по-своему. (Лев Николаевич Толстой. Анна Каренина)</div>

</body>
</html>

Объектная модель

[window.]document.getElementById("elementID").style.visibility

Примечание

Аргумент collapse браузер Mozilla поддерживает только с версии 1.8а. Internet Explorer это значение игнорирует полностью.

Категория: Свойства CSS | Добавил: expert1 (31.01.2013)
Просмотров: 344 | Теги: CSS, свойства | Рейтинг: 0.0/0
Всего комментариев: 0

Проекты

RSS Правила Бесплатный хостинг uCoz Litra Library
^ Наверх ^