display

 
display - позволяет изменять базовые свойства элементов.

Значения

Список значений этого свойства, понимаемый разными браузерами очень короткий — block, inline, list-item и none. Все остальные допустимые значения поддерживаются браузерами выборочно.

block - элемент отображается как блочный. Применение этого значения для встроенных элементов, например тега <span>, заставляет его вести подобно блокам — происходит перенос строк в начале и в конце содержимого.
inline - элемент отображается как встроенный. Использование блочных тегов, таких как <div> и <p>, автоматически создает перенос и показывает содержимое этих тегов с новой строки. Значение inline отменяет эту особенность, поэтому содержимое блочных элементов начинается с того места, где окончился предыдущий элемент.
inline-block - генерирует блочный элемент, который обтекается другими элементами веб-страницы подобно встроенному элементу. Фактически такой элемент по своему действию похож на встраиваемые элементы, вроде тега <img>. При этом, его внутренняя часть форматируется как блочный элемент, а сам элемент — как встроенный.
inline-table - определяет, что элемент является таблицей как при использовании тега <table>, но при этом таблица является встроенным элементом и происходит ее обтекание другими элементами, например, текстом.
list-item - элемент выводится как блочный и добавляется маркер списка.
none - временно удаляет элемент из документа. Занимаемое им место не резервируется и веб-страница формируется так, словно элемента и не было. Изменить значение и сделать вновь видимым элемент можно с помощью скриптов, обращаясь к свойствам через объектную модель. В этом случае происходит переформатирование данных на странице с учетом вновь добавленного элемента.
run-in - устанавливает элемент как блочный или встроенный в зависимости от контекста.
table - определяет, что элемент является блочной таблицей подобно использованию тега <table>.
table-caption - задает заголовок таблицы подобно применению тега <caption>.
table-cell - указывает, что элемент представляет собой ячейку таблицы (тег <td> или <th>).
table-column - назначает элемент колонкой таблицы, словно был добавлен тег <col>.
table-column-group - определяет, что элемент является группой одной или более колонок таблицы, как при использовании тега <colgroup>.
table-footer-group - используется для хранения одной или нескольких строк ячеек, которые отображаются в самом низу таблицы. По своему действию сходно с работой тега <tfoot>.
table-header-group - элемент предназначен для хранения одной или нескольких строк ячеек, которые представлены вверху таблицы. По своему действию сходно с работой тега <thead>.
table-row - элемент отображается как строка таблицы (тег <tr>).
table-row-group - создает структурный блок, состоящий из нескольких строк таблицы аналогично действию тега <tbody>.

Пример использования

.nav {display: none}

Характеристики

1. Применяется ко всем элементам.
2. Значение по умолчанию: inline
3. Не наследуется.

Синтаксис

display: block | inline | inline-block | inline-table | list-item | none | run-in | table | table-caption | table-cell | table-column-group | table-column | table-footer-group | table-header-group | table-row | table-row-group

Версии CSS

CSS 2
CSS 2.1
CSS 3

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

visibility

Нашли ошибку, опечатку, неточность, неактуальную или устаревшую информацию? Пишите.