flex布局:
- flex容器:设置了flex的父元素flex项目:flex元素的子元素
- flex布局的基本特征:
- 1:默认水平方向为主轴,垂直方向为侧轴2:项目默认沿着主轴方向排列
- 3:设置为flex布局后,浮动,清除浮动, vertical-align都失效
- 容器属性:(给自己设置,控制子元素)
- 1: display:设置为弹性盒;
- flex
- inline -flex
- 【注】所有的flex相关属性都必须设置为了flex布局,才能生效
- 2:flex-direction:设置主轴方向;
- row 水平主轴
- rOw-reverse反向水平主轴column垂直主轴
- column -reverse反向垂直主轴
- 3: flex-wrap:是否换行;
- nowrap不换行
- wrap 换行
- wrap-reverse反向换行