CSS Attributes Index Classification Attributes
Sets or retrieves whether an object is rendered.
| CSS |
{ display: 'block' | 'none' | 'inline' | 'list-item' } |
| Script |
object.style.display = sDisplay ] |
| block |
Creates a block-level box. |
| none |
Object is not rendered. |
| inline |
Creates an inline box sized by the dimensions of the content. |
| list-item |
Creates a block-level box and adds a list-item marker. |
| table-header-group |
Specifies that the table header is always displayed before all other rows and rowgroups, and after any top captions. The header is displayed on each page spanned by a table. |
| table-footer-group |
Specifies that the table footer is always displayed after all other rows and rowgroups, and before any bottom captions. The footer is displayed on each page spanned by a table. |
The property is read/write with a default value of block for block elements, and inline for inline elements; this attribute is not inherited.
In Internet Explorer® 4.0, the values block, inline, and list-item are not supported explicitly, but do render the element.
The block and inline possible values are supported explicitly as of Microsoft® Internet Explorer® 5.
All visible HTML objects are either block or inline. For example, a DIV object is a block element, and a SPAN object is an inline element.
Block elements typically start a new line and can contain other block elements and inline elements. Inline elements do not typically start a new line and can contain other inline elements or data. Changing the possible values for the display property affect the layout of the surrounding content by:
- adding a new line after the element with the value block
- removing a line from the element with the value inline
- hiding the data for the element with the value none
In contrast to the visibility property, display=none reserves no space for the object on the screen.
The table-header-group and table-footer-group possible values can be used to specify that the contents of the THEAD and TFOOT objects are displayed on every page for a table that spans multiple pages.
The following example demonstrates the effects of applying the different values possible for the CSS display attribute.
This feature requires Microsoft® Internet Explorer® 5 or later.
Show me
The following example shows how the display property can be used to dynamically show or hide content.
Show me
visibility, Display and Visibility