display的作用：
display属性可以设置元素的内部和外部显示类型
1.元素的外部显示类型将决定该元素在流式布局中的表现
2.元素的内部显示类型可以控制其子元素的布局
外部显示：
1.none:该属性值表示此元素不会被显示,使用这个属性，被隐藏的元素不占据任何空间，用户交互操作例如点击事件都不会生效，读屏软件也不会读到元素的内容，这个元素的任何子元素也会同时被隐藏。当使用该属性将元素从显示状态切换为隐藏状态时，元素不占据原本的空间，会触发浏览器的重绘与回流。
2.block:该属性值表示此元素将显示为块级元素，此元素前后会带有换行符，元素独占一行，封闭后自动换行，默认宽度为100%，可以指定宽度和高度，内外边距对于四个方向有效。
3.inline:该属性值表示此元素会被显示为内联元素，元素会生成一个或多个内联元素框，这些框不会在自身之前或之后产生换行符，在正常流中，如果有空间，则下一个元素将在同一行上，元素排在一行，封闭后不会自动换行，不能指定高度与宽度，可以使用line-height来指定高度，外边距对于水平方向有效，垂直方向无效，内边距对于水平方向正常有效，垂直方向只有效果，对其他元素无任何影响。
4.inline-block:该属性值表示此元素将显示为内联块元素，该元素生成一个块元素框，该框将随周围的内容一起流动，就好像它是单个内联框一样，与被替换的元素非常相似，它等效于内联流根inline flow-root，可以指定宽度和高度，内外边距对于四个方向有效元素排在一行，但是在回车后会有空白缝隙。
内部显示：
1.table：该属性值表示此元素会作为块级表格来显示，类似**
**，表格前后带有换行符。2.flex：属性值表示此元素会作为弹性盒子显示，在外部表现为block，内部作为弹性盒子使用，弹性布局可以为盒状模型提供最大的灵活性。
3.inline-table：该属性值与 display: table 在元素内部表现相同，在元素外部显示表现为inline。
4.inline-flex：该属性值与display: flex在元素内部表现相同，在元素外部显示表现为inline。
