五、flex
2019-12-10 本文已影响0人
yuzhan550
-webkit-box
-webkit-flex / flex
主轴 侧轴
1. Old version:
布局方向:
-webkit-box-orient: horizontal/vertical
排列方向:
-webkit-box-direction: normal/reverse
富裕空间的管理:
webkit-box-pack
start
end
center
justify
侧轴:
webkit-box-align
start
end
center
2. New version:
布局&排列方向:flex-direction
row
row-reverse
column
column-reverse
富裕空间的管理:
justify-content
flex-start
flex-end
space-between
space-around
侧轴:
align-items:
flex-start
flex-end
center
baseline
(用得少)
stretch
(等高布局,项目没有高度)
多行多列:
align-content:flex-start
单行单列:
align-items:flex-start