Свойство display позволяет изменять базовые свойства элементов. Например, элемент может стать скрытым, блочный элемент может отображаться как инлайновый, инлайновый элемент может отображаться как блочный. (читайте про Блочную модель).
Свойство display часто используется для того, чтобы скрывать ненужные блоки (заголовки, меню и прочий дизайн) при печати страниц на принтере. Это легко сделать, задействовав соответствующие стили из внешнего CSS-файл с помощью XHTML-элемента link:

Пример

Возможные значения

inline
Элемент отображается в виде прямоугольника, ширина которого соответствует ширине данных внутри него.
block
Элемент отображается как прямоугольник, ширина которого занимает 100% ширины родительского элемента.
list-item
Элемент отражается, как элемент списка.
run-in
Элемент отображается как блочный или инлайновый прямоугольник в зависимости от контекста.
inline-block
Элемент ведет себя как инлайн прямоугольник, но содержимое внутри элемента отображается так, как-будто оно внутри блочного элемента.
table
Элемент отражается как табличный элемент.
inline-table
Элемент ведет себя как табличный, но отображается как инлайновый прямоугольник.
table-row-group
Элемент ведет себя как tbody элемент.


table-header-group
Элемент ведет себя как thead элемент.


table-footer-group
Элемент ведет себя как tfoot элемент.

table-row
: Элемент ведет себя как tr элемент.
table-column-group
Элемент ведет себя как colgroup элемент.


table-column
Элемент ведет себя как col элемент.
table-cell
Элемент ведет себя как td элемент.
table-caption
Элемент ведет себя как caption элемент.
none
Скрывает элемент и его "детей" убирая их со страницы. Свойство display часто используется для того, чтобы скрыть элементы, являющиеся заголовками, пунктами навигационного меню, сносками и т.п. в CSS файле, который используется для печати.
inherit
Заимствует значение свойства у родительского элемента.

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

Значение по умолчанию: inline

Применяется: Ко всем элементам

Наследуется: Нет