局里局气的范先生
运维施法工程师
获得徽章 0
- #每天一个知识点#
flex布局有哪些属性？
1. flex-direction：定义主轴的方向，可以是row（水平方向），column（垂直方向），row-reverse（反向水平方向）或column-reverse（反向垂直方向）。
2. flex-wrap：定义是否换行，可以是nowrap（不换行），wrap（换行），wrap-reverse（反向换行）。
3. justify-content：定义主轴上的对齐方式，可以是flex-start（靠左/靠上），flex-end（靠右/靠下），center（居中），space-between（两端对齐，项目之间间隔相等）或space-around（每个项目两侧间隔相等）。
4. align-items：定义交叉轴上的对齐方式，可以是flex-start（靠上/靠左），flex-end（靠下/靠右），center（居中），baseline（基线对齐）或stretch（拉伸填充容器）。
5. align-content：定义多行项目的对齐方式，可以是flex-start（靠上/靠左），flex-end（靠下/靠右），center（居中），space-between（两端对齐，行之间间隔相等）或space-around（每行两侧间隔相等）。
6. flex：定义Flex项目的伸缩比例、基准值和可伸缩性。展开2点赞
![[大笑]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_55.74ed629.png)
![[无辜呆]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_96.4fb9d71.png)