flex 基础

2021年02月23日 22:15:58阅读数:67博客 / 豌豆君 / html

flex

1. 术语

  1. 容器: 具有’display:flex’属性元素
  2. 项目: flex 容器的”子元素”
  3. 主轴: 项目排列的轴线
  4. 交叉轴: 与主轴垂直的轴线

2. 容器属性

序号 属性 描述
1 ‘flex-flow’ 主轴方向与换行方式
2 ‘justify-content’ 项目在主轴上的对齐方式
3 ‘align-items’ 项目在交叉轴上的对齐方式
4 ‘align-content’ 项目在多行容器中的对齐方式

3. 项目属性

序号 属性 描述
1 ‘flex’ 项目的缩放比例与基准宽度
2 ‘align-self’ 单个项目在交叉轴上的对齐方式
3 ‘order’ 项目在主轴上排列顺序

全部评论

文明上网理性发言,请遵守新闻评论服务协议

条评论
  • 博主信息
    豌豆君
    博文
    16
    粉丝
    0
    评论
    0
    访问量
    1689
    积分:0
    P豆:34