flex布局原理通过向父框中添加flex属性来控制框的位置和放置方式。 如果为父元素设置flex布局，则子元素的浮点、清除和垂直对齐属性将被禁用。
flex:布局也称为伸缩布局、弹性布局、伸缩框布局和flex布局
flex通用父代通用属性
flex-direction :设定主轴的方向
justify-content :设置子元素在主轴上的放置方式
flex-wrap :设置子元素是否换行
对齐内容：设置子元素在侧轴上的放置方式。 多行)
((对齐-项目)在侧轴上设置子元素的位置(单行) ) ) ) ) ) ) ) ) ) ) ) )。
flex-flow :在复合属性中，相当于同时设置了flex-direction和flex-wrap
flex常见的子属性
flex子项目所占的分数
aglin-self控件子项目自身在侧轴上的排列方式
order属性定义子代的排列顺序(前后顺序)
将flex设置为垂直居中的两种方法之一是在父元素中设置代码
style .box{ width:400px； height:400px； border :1 px固态黑； 显示： Flex； flex-direction: column； /* co1umn自上而下*/align-items: center； /* center是水平方向*/justify-content: center； /* center是垂直方向*/} .content{ width:200px； height:200px； border :1 px固态硬盘； 文本对齐3360中心； line-height: 200px； }/stylebodydivclass=' box ' divclass=' content '我将设置为垂直中心框/div /div/body的第二子元素
. box{ width:400px； height:400px； border :1 px固态黑； 显示： Flex； /*如何相对于子元素垂直对齐* /对齐- items : center； /*子元素的水平对齐方法*/justify-content: center； } .content{ width:200px； height:200px； border :1 px固态硬盘； 文本对齐3360中心； line-height: 200px； }使用divclass=' box ' divclass=' content '子元素方法将/div /div垂直居中