This tutorial is from open-source community. Access the source code
💡 Этот учебник переведен с английского с помощью ИИ. Чтобы просмотреть оригинал, вы можете перейти на английский оригинал
В этом практическом занятии мы изучим псевдокласс :empty в CSS, который позволяет нам выбирать и скрывать элементы, не содержащие контента. Применяя эту технику, мы можем улучшить общий дизайн и читаемость наших веб-страниц, удаляя беспорядок и пустые пространства. С помощью серии упражнений мы научимся эффективно использовать псевдокласс :empty для скрытия пустых элементов и создания более чистых и выразительных веб-страниц.
В ВМ уже предоставлены файлы index.html и style.css.
Для скрытия элементов, не содержащих контента, используйте псевдокласс :empty. Например, если у вас есть следующий HTML-код:
<p>Lorem ipsum dolor sit amet. <button></button></p>Вы можете использовать следующий CSS-код, чтобы скрыть элемент кнопки, не содержащий контента:
p:empty {
display: none;
}Пожалуйста, нажмите кнопку 'Go Live' в нижнем правом углу, чтобы запустить веб-сервис на порту 8080. Затем вы можете обновить вкладку Web 8080, чтобы просмотреть веб-страницу.
Поздравляем! Вы завершили практическое занятие "Скрыть пустые элементы". Вы можете выполнить больше практических занятий в LabEx, чтобы улучшить свои навыки.
