Flex布局

flex是一种响应式自适应布局
属性
display： flex 设置其元素为flex
采用 Flex 布局的元素，称为 Flex 容器（flex container），简称"容器"。
它的所有第一级子元素自动成为容器成员，称为 Flex 项目（flex item），简称"项目"。
子元素不会继承继承flex的属性。
flex分为主轴和交叉轴

6大属性

（项目排列方向）flex-direction: row | column | row-reverse | column-reverse
（主轴对齐方式）justify-content: flex-start | flex-end | center | space-between | space-around
（交叉轴对其方式）align-items: flex-start | flex-end | center | stretch | baseline