тк 3 июля праздник (в беларуси), буду не онлайн (по возможности буду отвечать)

Псевдокласс empty

Псевдокласс empty задает то, как будет выглядеть пустой элемент (не содержащий текста).

Синтаксис

селектор:empty { }

Пример

В данном примере последняя li пустая, но все равно будет иметь маркер:

<ul> <li>list item</li> <li>list item</li> <li>list item</li> <li>list item</li> <li></li> </ul>

:

Пример

Поменяем поведение для пустого тега li:

<ul> <li>list item</li> <li>list item</li> <li>list item</li> <li>list item</li> <li></li> </ul> li:empty { border: 1px solid blue; list-style-type: circle; color: blue; width: 100px; }

:

Пример

Спрячем пустые li совсем:

<ul> <li>list item</li> <li>list item</li> <li>list item</li> <li>list item</li> <li></li> </ul> li:empty { display: none; }

:

Смотрите также

  • свойство empty-cells,
    которое указывает браузеру, как отображать фон и границу пустых ячеек таблицы