本章主要总结Flex(很重要)
在组件样式中使用flex可以使其在可利用的空间中动态地扩张或收缩。
一般而言我们会使用flex:1来指定某个组件扩张以撑满所有剩余的空间。
如果有多个并列的子组件使用了flex:1，则这些子组件会平分父容器中剩余的空间。
如果这些并列的子组件的flex值不一样，则谁的值更大，谁占据剩余空间的比例就更大（即占据剩余空间的比等于并列组件间flex值的比）。
一般来说，使用flexDirection、alignItems和 justifyContent三个样式属性就已经能满足大多数布局需求。简易布局图解
flex指定占比，为1表示占满父容器。
flexDirection指定主轴方向，默认为column，可选值column、row。
justifyContent指定主轴方向的排列方式，默认为flex-start，可选值：flex-start、center、flex-end、space-around以及space-between。
alignItems指定次轴方向的排列方式，默认为flex-start，可选值：flex-start、center、flex-end以及stretch。
引申：盒子模型
网友评论