css display属性详解

css display属性在对css做layout设计时非常重要，它的值有以下几种：

 

ValueDescriptionPlay itinlineDefault value. Displays an element as an inline element (like <span>)Play it »blockDisplays an element as a block element (like <p>)Play it »flexDisplays an element as an block-level flex container. New in CSS3 inline-blockDisplays an element as an inline-level block container. The inside of this block is formatted as block-level box, and the element itself is formatted as an inline-level box inline-flexDisplays an element as an inline-level flex container. New in CSS3 inline-tableThe element is displayed as an inline-level table list-itemLet the element behave like a <li> elementPlay it »run-inDisplays an element as either block or inline, depending on context tableLet the element behave like a <table> element table-captionLet the element behave like a <caption> element table-column-groupLet the element behave like a <colgroup> element table-header-groupLet the element behave like a <thead> element table-footer-groupLet the element behave like a <tfoot> element table-row-groupLet the element behave like a <tbody> element table-cellLet the element behave like a <td> element table-columnLet the element behave like a <col> element table-rowLet the element behave like a <tr> element noneThe element will not be displayed at all (has no effect on layout)Play it »initialSets this property to its default value. Read about initialPlay it »inheritInherits this property from its parent element. Read about inherit