⚙️ Что такое свойство visibility в CSS и зачем оно используется?
1 марта 2025 г.CodeBase | Frontend
⚙️ Что такое свойство visibility в CSS и зачем оно используется?
visibility — это CSS-свойство, которое управляет видимостью элемента, но при этом не удаляет его из документа. Оно позволяет скрывать элементы без изменения их занимаемого пространства.
➡️ Пример:
<div class="box">Этот блок всегда виден</div> <div class="box hidden">А этот скрыт, но занимает место</div> <style> .box { width: 200px; height: 50px; border: 1px solid black; text-align: center; line-height: 50px; } .hidden { visibility: hidden; /* Элемент становится невидимым, но остаётся на месте */ } </style>🗣 В этом примере:
-
visibility: hidden; скрывает элемент, но он по-прежнему занимает место в разметке.
-
display: none; убирает элемент полностью (в отличие от visibility).
Это свойство помогает управлять интерфейсом без изменения структуры страницы.
CodeBase | Frontend | #CSS