本文深入探讨了Flex布局中的关键概念，包括`align-self`如何允许单个子元素自定义侧轴对齐方式，`order`属性如何定义元素的排列顺序，以及`flex`属性如何指定子项在剩余空间中的占比。了解这些属性能帮助开发者更精确地控制Flex容器内元素的布局和顺序。
flex子项目占的份数
align-self 控制子项自己在侧轴的排列方式
order属性定义子项的排列顺序 (前后顺序)
flex属性(最重要)
flex属性定义子项目分配剩余空间, 用flex来表示占多少份数
align-self 控制子项自己在侧轴上的排列方式
align-self 属性允许单个项目与其他项目不一样的对齐方式, 可覆盖 align-items属性 .
默认值为 auto , 表示继承父元素的 align-items 属性, 如果没有父元素, 则等同于 stretch
order 属性定义项目的排列顺序
数值越小, 排列越靠前, 默认为 0
注意: 和 z-index 不一样
order: <number> ; 默认值是0. 规定灵活项目的顺序
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
