弹性容器通过设置 display 属性的值为 flex 或 inline-flex将其定义为弹性容器。
tips：属性要写在父元素中才能够有作用
属性：
flex-direction：用来指定子元素在父元素的位置
值：flex-direction: row 左对齐 flex-direction:column 纵向对齐
justify-content：使内容沿着主轴对齐
值：justify-content：center 内容居中
justify-content：space-between 内容平均分布在一行，如果有空余空间，内容会贴着边沿，空余空间在内容之间
效果图：
justify-content：space-around 内容平均分布在一行，如果有空余空间，内容不会贴着边缘，左右两边都会均匀分布空余空间
效果图：
align-items：设置或检索弹性盒子元素在侧轴（纵轴）方向上的对齐方式。
值：align-items: flex-start | flex-end | center | baseline | stretch
flex-wrap：指定子元素的换行方式
值：flex-wrap：nowarp 容器为单行，但是内容有可能溢出容器 flex-wrap：warp 容器为多行，单行空间不够时会换行
align-content：用于修改 flex-wrap 属性的行为。类似于 align-items, 但它不是设置弹性子元素的对齐，而是设置各个行的对齐
值：align-content: center | space-between | space-around 效果与justify-content类似，只是align-content是纵轴对齐
