定义
display 属性规定元素应该生成的框的类型。
注意：这个属性用于定义建立布局时元素生成的显示框类型。对于 HTML 等文档类型，如果使用 display 不谨慎会很危险，因为可能违反 HTML 中已经定义的显示层次结构。
属性值
值 | 说明 （索引中有详细介绍） |
inline | 默认。此元素会被显示为内联元素，元素前后没有换行符。 |
block | 此元素将显示为块级元素。 |
content | 盒子文本正常绘制，而围绕在盒子中的框并不会生成。 |
flex | 此元素将显示为弹性盒容器。 |
grid | 此元素将显示为栅格容器。 |
inline-block | 此元素将显示为行内块元素。 |
inline-flex | 此元素将显示为行内弹性盒容器。 |
inline-grid | 此元素将显示为行内栅格容器。 |
inline-table | 此元素会作为内联表格来显示（类似 ），表格前后没有换行符。 |
list-item | 此元素会作为列表显示。 |
run-in | 此元素会根据上下文作为块级元素或内联元素显示。 |
table | 此元素会作为块级表格来显示（类似 table元素），表格前后带有换行符。 |
table-caption | 此元素会作为一个表格标题显示（类似 caption 元素）。 |
table-column-group | 此元素会作为一个或多个列的分组来显示（类似 colgroup 元素）。 |
table-header-group | 此元素会作为一个或多个行的分组来显示（类似 thead 元素）。 |
table-footer-group | 此元素会作为一个或多个行的分组来显示（类似 tfoot 元素）。 |
table-row-group | 此元素会作为一个或多个行的分组来显示（类似 tbody 元素）。 |
table-cell | 此元素会作为一个表格单元格显示（类似 td 元素） |
table-column | 此元素会作为一个单元格列显示（类似 col 元素） |
table-row | 此元素会作为一个表格行显示（类似 tr 元素）。 |
none | 此元素不会被显示。 |
initial | 设置该属性为默认元素。 |
inherit | 规定应该从父元素继承 display 属性的值。 |
其次： 行内元素、块状元素、行内块状元素的区别：
1.行内元素特征：(1)设置宽高无效
(2)对margin仅设置左右方向有效，上下无效；padding设置上下左右都有效，即会撑大空间
(3)不会自动进行换行
2.块状元素特征：(1)能够识别宽高
(2)margin和padding的上下左右均对其有效
(3)可以自动换行
(4)多个块状元素标签写在一起，默认排列方式为从上至下
3.行内块状元素
行内块状元素综合了行内元素和块状元素的特性，但是各有取舍。因此行内块状元素在日常的使用中，由于其特性，使用的次数也比较多。
行内块状元素特征：(1)不自动换行
(2)能够识别宽高
(3)默认排列方式为从左到右
1 块级元素：div , p , form, ul, li , ol, dl, form, address, fieldset, hr, menu, table
2 行内元素：span, strong, em, br, img , input, label, select, textarea, cite,
作者：咸瑜
