阅读 93

分享个人在项目使用flex布局封装好的样式类

下面分享个人在项目使用flex布局封装好的样式类

flex布局示例和源码

一、基本概念

采用 Flex 布局的元素,称为 Flex 容器(flex container),简称"容器"。它的所有子元素自动成为容器成员,称为 Flex 项目(flex item),简称"项目"。

二、容器的属性

  • flex-direction

    flex-direction属性决定主轴的方向

  • flex-wrap

    如果一条轴线排不下,定义如何换行。

  • flex-flow

    flex-flow属性是flex-direction属性和flex-wrap属性的简写形式,默认值为row nowrap

  • justify-content

    justify-content属性定义了项目在主轴上的对齐方式。

  • align-items

    align-items属性定义项目在交叉轴上如何对齐

  • align-content

    align-content属性定义了多根轴线的对齐方式。如果项目只有一根轴线,该属性不起作用。

关注下面的标签,发现更多相似文章
评论