(12) Learn the display properties of CSS

Reference: http://www.w3school.com.cn/cssref/pr_class_display.asp

Browser support

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.

Value Description None This element is not displayed. Block this element will be 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 the inline block element. (CSS2.1added value) List-item This element is displayed as a list. Run-inchThis element is displayed as a block-level element or inline element, depending on the context. The compact CSS has the value compact, but has been removed from CSS2 due to a lack of broad support.1deleted in the. Marker CSS has a value of marker, but because of the lack of broad support, has been from CSS2.1deleted in the. Table This element is displayed as a block-level table (similar to<table>), with a newline character before and after the table. Inline-table This element is displayed as an inline table (similar to the <table>), 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 <tbody>). Table-header-group This element is displayed as a grouping of one or more rows (similar to <thead>). Table-footer-group This element is displayed as a grouping of one or more rows (similar to <tfoot>). Table-row This element is displayed as a table row (similar to the <tr>). Table-column-group This element is displayed as a grouping of one or more columns (similar to <colgroup>). Table-column This element is displayed as a cell column (similar to the <col>) Table-cell This element is displayed as a table cell (like <td> and <th>) Table-caption This element is displayed as a table header (similar to the <caption>inherit specifies that the value of the display property should be inherited from the parent element. 

Default value: Inline.

(12) Learn the display properties of CSS