# Псевдокласс 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`,
  которое указывает браузеру, как отображать фон и границу пустых ячеек таблицы

←→
↑