Когда использовать видимость: скрытая vs отображение: нет

Я понимаю, что использование visibility:hidden сохраняет пространство на странице, а display:none - нет, однако, когда имеет смысл «сохранять» пространство? Это может оставить неудобную пустую область / зияющую дыру на странице.

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
0
0
634
1

Ответы 1

Дисплей: нет - Динамические страницы / разделы: обычно используется для больших динамических областей на странице, чтобы не оставлять неудобных пустых областей, из-за которых страница выглядит плохо. При отображении он будет перемещать другие части страницы и отображать себя на той странице, где он должен быть, изменяя положение и расположение окружающих элементов страницы по мере необходимости / задуманного.

Видимость: скрыта - Статические страницы / разделы: используйте это для меньших частей, где перемещение окружающих элементов, когда эта часть становится видимой, является нежелательный, то есть: отображение / скрытие значка в разделе страницы. Использование display: none не могло / не могло бы заставить себя войти в раздел страницы и переместить окружающие его элементы, чтобы освободить место для себя, что привело бы к перемещению по странице. Использование видимости: hidden в этом случае скроет / покажет элемент «значок» без какого-либо перемещения остальных окружающих элементов страницы, поскольку это пространство было «сохранено / зарезервировано» для него, поэтому оно просто «включает / выключает» "без видимого движения.

Поскольку это использование находится на небольшом участке в противном случае «статического» раздела страницы, пустая «дыра» на странице, оставшаяся там из-за «сохраненного / зарезервированного» пространства, не заметна, когда она скрыта, потому что «макет» страницы не зависят от небольшого «сохраненного / зарезервированного» места для значка. Это всего лишь маленький кусочек в большей статической области.

Надеюсь, это поможет решить, когда и где использовать эти два, казалось бы, похожих атрибута.

Другие вопросы по теме