Properties
CSS
display
The display property specifies how/if an element is displayed on the canvas.
CSS1
display: inline | block | list-item | none
CSS2
display: inline | block | list-item | run-in | inline-block | table | inline-table | table-row-group | table-header-group | table-footer-group | table-row | table-column-group | table-column | table-cell | table-caption | none | inherit
| Initial: | inline |
| Applies To: | all elements |
| Inherited: | no |
| Percentages: | NA |
| Media: | all |
Note: Doctype is required for Internet Explorer 8+ on CSS2
- Values
- DOM
- Example | Values | block
- Example | Values | inline
- Example | Values | inline-block
- Example | Values | inline-table
- Example | Values | list-item
- Example | Values | none
- Example | Values | run-in
- Example | Values | table
- Example | Values | table-caption
- Example | Values | table-cell
- Example | Values | table-column
- Example | Values | table-column-group
- Example | Values | table-footer-group
- Example | Values | table-header-group
- Example | Values | table-row
- Example | Values | table-row-group
- Example | DOM | 1
- Example | DOM | 2
- Example | DOM | 3
- References
Values
display: value;
| Value: | Description: |
| block | Generates a block box |
| inherit | Takes the same computed value as the property for the element's parent |
| inline | Generates one or more inline boxes |
| inline-block | Generates a block box which is flowed as a single inline box |
| inline-table | Behaves like an inline table element |
| list-item | Generate a principal block box and a list-item inline box |
| none | Generate no box |
| run-in | Generates either block or inline boxes depending on context |
| table | Behaves like a table element |
| table-caption | Behaves like a caption element |
| table-cell | Behaves like a td element |
| table-column | Behaves like a col element |
| table-column-group | Behaves like a colgroup element |
| table-footer-group | Behaves like a tfoot element |
| table-header-group | Behaves like a thead element |
| table-row | Behaves like a tr element |
| table-row-group | Behaves like a tbody element |
DOM
[window.]document.getElementById("element-id").style.display = "display";
