整个页面的切换是依赖滑条的
Displaying items in a single dimension[维度] as a row[水平] or as a column[竖直].
-
flex: property sets how a flex item will grow or shrink to fit the space. It is a shorthand for flex-grow, flex-shrink, and flex-basis.
-
align-: the cross-axis(x).
-
justify-: the main-axis(y).
-
align-items: alignment of items on the Cross Axis
-
justify-content:distributes space between and around content items along the main-axis.
-
align-content: distributes space between and around content items along the cross-axis.
(flex中多子元素才生效)
叫cross和main(交叉和主轴) 是因为flex-direction可以指定主轴的走向(垂直或竖直)
-
order: Sequential[先后顺序]
-
flex-grow: 占比放大
-
flex-shrink: 占比缩小
-
flex-basis: 占固定空间
-
flex: property[属性] sets how a flex item will grow or shrink to fit the space. It is a shorthand for flex-grow, flex-shrink, and flex-basis.(建议优先写这个)
-
align-self: 属性允许单个项目有与其他项目不一样的对齐方式,可覆盖align-items属性。 默认值为auto,表示继承父元素的align-items属性,如果没有父元素,则等同于stretch。