CSS规则中，display：属性控制将用于控制一个元素内的子元素的布局。
块元素
当display：block时，将子元素设置为块元素，块元素的特征如下：
-
子元素的宽度和高度属性可用
-
子元素的外边距会把其他盒子推开
-
子元素为自动换行并布满一整行
当display：inline时，子元素设置为内联元素，宽和高都不能设置，且不会将其他元素推开且换行。
当display：inline-block时，子元素设置为内联块元素，可以设置宽和高，但不会换行和占满一行。
弹性盒子
当display：flexible时，表示为弹性盒子布局。
弹性盒子中子元素的布局方向主轴和交叉轴，子元素将在主轴的方向上进行排列。
如果确定主轴是由属性flex-flow来控制，默认情况下flex-flow:row，也就是设置行，既横向为主轴
当设置flex-flow:col时的布局如下：
flex-flow是一个组合属性，还可以传入一个值wrap。当设置子元素为定宽时，可能会导致溢出，设置flew-flow:row wrap，就可以使子元素在溢出时自动换行。
设置子元素的尺寸时，由flex:100px这个属性控制，也可以设置某个子元素的尺寸为动态尺寸，flex:2代表设置这个子元素的尺寸占总比例的两份。
还有两个比较重要的属性，控制子元素的居中：
justify-content:center 主轴方向的居中
align-items:center 交叉轴方向居中