Detailed description of display properties in CSS

CSS Display Properties

Display properties are supported by all major browsers.

Note: If it is stipulated! DOCTYPE, Internet Explorer 8 (and later) supports the attribute value "Inline-table", "run-in", "table", "Table-caption", "Table-cell", " Table-column "," Table-column-group "," Table-row "," Table-row-group ", and" inherit ".

Definition and usage

The Display property specifies the type of box that the element should generate.

Description

This property is used to define the type of display box generated by the element when the layout is established. For document types such as HTML, it can be dangerous to use display without caution because it may violate the display hierarchy already defined in HTML. For XML, all display is absolutely necessary because XML does not have this hierarchical structure built into it.

Note: The CSS2 has the value compact and marker, but has been removed from the CSS2.1 due to a lack of broad support.

Default value:	Inline
Inheritance:	No
Version:	CSS1
JavaScript Syntax:	object.style.display= "inline"

Possible values

value	Description
None	This element is not displayed.
Block	This element is displayed as a block-level element with a newline character before and after this element.
Inline	Default. This element is displayed as an inline element with no line break before or after the element.
Inline-block	Inline block element. (CSS2.1 new value)
List-item	This element is displayed as a list.
Run-in	This element is displayed as a block-level element or inline element, depending on the context.
Compact	There is a value compact in CSS, but it has been removed from CSS2.1 due to a lack of broad support.
Marker	The CSS has a value of marker, but it has been removed from the CSS2.1 due to a lack of broad support.
Table	This element is displayed (similar) as a block-level table with a line break before and after the table. Inline-table This element is displayed as an inline table (similar), there are no line breaks before or after the table. ）。 ）。 ）。 ）。 ）。 Table-row-group This element is displayed as a grouping of one or more rows (similar to table-header-group this element is displayed as a grouping of one or more rows (similar to table-footer-group this element is displayed as a grouping of one or more rows (similar to table- Row this element is displayed as a table row (similar to table-column-group this element is displayed as a grouping of one or more columns (similar to table-column this element is displayed as a cell column (similar to Table-cell this element is displayed as a table cell (similar and) tabl E-caption This element is displayed as a table header (similar) inherit specifies that the value of the display property should be inherited from the parent element.