:empty

    0
    504

    :empty позволяет выбрать все пустые элементы на странице.

    Элемент считается пустым, если не содержит дочерних элементов и любого контента внутри. Наличие внутри элементов комментариев не влияет на выборку, следовательно:

    считается пустым и будет работать с псевдоклассом :empty. В то время как:

    не являются пустыми и не попадают в селектор :empty.

    Выборка пустых элементов полезна для скрытия их, т.к. такие элементы могут быть причиной наличия странной вертикальной или горизонтальной белой линии, если элемент имеет отступ.

    Тонкости & Особенности

    Содержимое созданное при помощи псевдо-элементов ::after и ::before не считается как содержимое элемента и поэтому не влияет на пустой элемент.

    В следующем примере правила селектора будут работать на <div><div>, при этом элемент не является пустым:

    Пример этого кода вы можете посмотреть в секции ниже.

    Пример

    Поддержка браузерами

    Псевдокласс :empty поддерживается в Chrome, Firefox, Safari, Opera 9.5+, Internet Explorer 9+, на Android и iOS.

    ПОДЕЛИТЬСЯ
    Предыдущая статья:enabled
    Следующая статья:first-child
    Постоянный автор на exabyte.ws. Специализируюсь на Wordpress, Javascript & jQ, REST API. Любые вопросы связанные с Web разработкой вы можете задать лично или в группе вконтакте.

    ОСТАВЬТЕ ОТВЕТ

    Пожалуйста оставьте комментарий!
    Введите ваше имя