用于指定一个元素在页面中的显示方式
HTML中标签元素大体被分为三种类型：块元素、行内元素和行内块元素
块元素 ：block
1.独占一行
2.水平方向，占满它父元素的可用空间（宽度是父级的100%）
3.垂直方向，占据的空间由其内容大小决定
4.可以通过 css 属性
width、height设置该元素的宽和高（添加宽高都生效）常见的block模式下的元素：
div main ul li p address article aside blockquote dd dl dt footer form h1 h2 h3 h4 h5 h6 header hr nav ol pre section table行内元素 ：inline
1.一行可以显示多个
只要 当前行有剩余空间可以容纳自身内容，就会显示在里面；如果没有剩余空间，才会移到下一行。
如果前面的兄弟元素是inline模式，往往会在同行显示
如果前面的兄弟元素是block模式，则会在不同行显示
2.宽度和高度默认由内容撑开
3.css 属性 width 、 height 不起作用（设置宽高不生效）
span a audio b br button canvas em embed i iframe img input label select strong svg textarea video行内块元素：inline-block
1.一行可以显示多个
2.可以设置宽高
display：block；(将元素转换为块元素)
display：inline;（将元素转换为行内元素）
display：inline-block;（将元素转换为行内块元素）
display：none;（元素将被隐藏）
display：flex；（将元素作为弹性盒子显示）（弹性布局）
采用flex布局的元素，称为 Flex 容器（flex container），简称"容器"
display:grid；（将元素作为网格容器显示）
display:table；（将元素作为表格显示）
本文参考自：界面布局 - 基本规则 | 白月黑羽