CSS: какая разница между visibility:hidden и display:none?

CSS, HTML, Вопросы и ответы
28 февраля 2012

Вопрос

И свойство visibility:hidden, и display:none скрывают отображение элемента на экране. Получается, что эти свойства работают идентично?


Ответ №1

Ни в коем случае!

display:none означает, что элемент не будет появляется на странице вообще (хотя при этом он будет хранится в DOM как полноценный объект). Таким образом, он не будет занимать на экране места, и между предыдущим перед ним и следующим за ним не образуется никакого промежутка.

Свойство visibility:hidden же означает, что элемент есть на странице, просто он невидимый, но место занимает. Получается как-бы промежуток, равный его размерам.

Сейчас продемонстрирую на примере:

<div style="width:100px;height:40px;background:aqua;"></div>
<div style="width:100px;height:40px;display:none;"></div>
<div style="width:100px;height:40px;background:gray;"></div>
Пример
<div style="width:100px;height:40px;background:aqua;"></div>
<div style="width:100px;height:40px;visibility:hidden;"></div>
<div style="width:100px;height:40px;background:gray;"></div>
Пример

5 комментария

  • Роман:

    Спасибо!

  • DeweyRaf:

    If you have a desire to learn how to earn from $ 500 per day and work only for yourself, then write to us at email: admin@makemoneyonline.universalxyzdom.xyz

  • AntonioUnalk:

    Открылся новый магазин все по 50 рублей, например определенный товар стоит 5000 рублей или 7000 рублей то у нас вы можете найти его всего за 50 рублей: http://shop-50-rubley.xyz
    магазин ежедневно пополняется, к концу недели будет очень богатый ассортимент.

  • Stepantig:

    Уникальная подборка инфы по Безопасности Бизнеса в России.

    bezopasnost-biznesmen-vrosii.ml

    Вся необходимая предпринимателю инфа в одном издании.
    УК КоАП статьи и санкции, пояснения и комментарии.
    Отличия при проведении проверок и ревизий правоохранительными органами.
    Все детали о милицейских и налоговых проверках.
    Законные методы противодействия необоснованным притязаниям правоохранительных и контролирующих структур.
    Советы известного адвоката по защите законных интересов директора, фирмы и ее сотрудников.

  • Stepantig:

    Уникальная сборка инфы по Безопасности Бизнеса в России.

    vse-o-nallogax-biznesmenu2017.tk

    Вся необходимая директору информация в одном отчете.
    УК КоАП статьи и санкции, пояснения и трактовки.
    Особенности при проведении проверок и ревизий правоохранительными органами.
    Все о налоговых и милицейских проверках.
    Законные методы противодействия необоснованным наездам правоохранительных и контролирующих структур.
    Рекомендаии адвоката по защите интересов собственника, фирмы и ее сотрудников.

Добавить комментарий


(обязательно)