Вы можете использовать свойство visibility, чтобы контролировать визуальную видимость элемента на странице. Это свойство может принимать одно из следующих значений, перечисленных в таблице ниже:

Значение Описание
visible Элемент отображается как видимый. Это значение установлено по умолчанию.
hidden Элемент и его содержимое невидимы, но элемент остается в DOM-дереве документа.
collapse Только для определенных внутренних объектов таблицы: строки (rows), группы строк (row groups), столбцы (columns) и группы столбцов (column groups). Он скрывает объекты, но никак не влияет на макет таблицы. Пространство, занимаемое объектом таблицы, будет заполнено последующими элементами таблицы
initial Устанавливает это свойство в значение по умолчанию.
inherit Если указан, связанный элемент принимает вычисленное значение своего родительского элемента visibility.

Значение visibility: collapse; удаляет внутренние элементы таблицы, но это никак не влияет на макет таблицы. Пространство, обычно занимаемое элементами таблицы, будет заполнено последующими элементами.

Если правило visibility: collapse; указать для других элементов, не для элементов таблицы, оно вызовет то же поведение, что и hidden.

Разница мажду свойствами visibility и display

CSS-свойства display и visibility на первый взгляд кажутся одинаковыми, но на самом деле имеют ряд отличительных особенностей.

  • visibility: hidden; скрывает элемент, но все равно занимает место в макете. Дочерний элемент скрытого поля будет видимым, если его visibility установлена как visible.
  • display: none; полностью удаляет элемент из документа. Он не занимает места, хотя HTML-код для него все еще находится в дереве. У всех дочерних элементов также отключено отображение, даже если их свойство display установлено на что-то отличное от none.

Похожие посты

Руководство по свойству opacity в CSS

CSS-свойство opacity означает непрозрачность и теперь является частью спецификаций CSS3. Старые браузеры имеют разные способы управления непрозрачностью. Opacity в Firefox, Safari, Chrome, Opera и IE9 Вот самый простой синтаксис для назначения непрозрачности CSS во всех современных браузерах. Приведенное выше правило сделает элемент абзаца непрозрачным на 70% (или прозрачным на 30%). Свойство opacity принимает значение от…

Руководство по таблицам в CSS

Таблицы обычно используются для отображения каких-либо упорядоченных табличных данных. После того, как вы создали HTML-таблицу, с помощью CSS вы можете значительно улучшить ее внешний вид. CSS предоставляет несколько свойств, которые позволяют вам управлять компоновкой и представлением элементов таблицы. В этом разделе вы увидите, как использовать CSS для стилизации таблиц. Добавление границ (border) в таблицы CSS-свойство…

Руководство по свойству margin в CSS

CSS-свойство margin позволяют вам установить интервал вокруг границы элемента (или края блока элемента, если у него нет определенной границы). На цвет элемента не влияет цвет фона background-color, он всегда прозрачен. Однако, если родительский элемент имеет цвет фона, он будет виден через область margin. Margin для отдельных сторон Вы можете установить margin для отдельных сторон используя…

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка 5 / 5. Количество оценок: 1

Оценок пока нет. Поставьте оценку первым.