1.flex: 弯曲,收缩
2.概念 2条主轴,main axis,cross axis; 每个单元为flex item,主轴空间main size,交叉轴空间cross size;
3.容器
.container{
display: flex | inline-flex;
}
块状元素用flex;行内元素用inline-flex;
使用之后,子元素的float、clear、vertical-align属性会失效。
a. flex-direction 觉得主轴方向
row 水平为主轴方向,起点在左端;(类似于左浮动)
row-reverse 水平为主轴方向,起点在右端;(类似于右浮动)
column 垂直为主轴方向,起点在顶端;
column-reverse 垂直为主轴方向,起点在底端;