1、大多数的Flexbox属性都应用于父容器的元素上,指定你想要制定的一个容器,使用一个特殊的值显示属性display:flex;
2、使用“flex-row”属性来指定子元素布局是在一行还是一列显示。参数flex-direction(伸缩流的方向)”、“flex-wrap(伸缩行换行)“。其中flex-direction(伸缩流的方向)的属性值: row、 row-revers、 column、 column-reverse。“flex-wrap(伸缩行换行)属性值:wrap、no-wrap、wrap-reverse。
设置flexbox子元素(伸缩项目)的对齐
侧轴对齐伸缩项目——align-items
主轴对齐伸缩项目——justify-content
伸缩项目堆栈伸缩行——align-content
order:设置伸缩项的显示顺序,order取值越大,越排在后面
使元素具有弹性
flex属性有三个参数:flex-grow(值1、2、3……省略为1)、flex-shrink(值1,2,3……省略为1)、flex-basis(值,200px等。若在flex缩写省略了此属性设置,则flex-basis的指定值是“0”,若flex-basis的指定值是“auto”,则伸缩基准值的指定值是元素主轴长度属性的值。)。
flex:auto”时,伸缩容器中的伸缩项目(相当于flex: 1 1 auto)
flex:initial”(相当于flex:0 1 auto)