设置侧轴上子元素排列方式_flex布局 父元素常见属性

flex布局 父元素常见属性

flex布局 父元素常见属性

flex-direction设置主轴方向:

1.主轴与侧轴

在flex布局中,分别为主轴和侧轴两个方向,或行列 或X轴Y轴

默认主轴方向是X轴,水平向右

默认侧轴方向是Y轴,水平向下

justify-conten 设置主轴上的子元素排列方式:

justify-content属性定义了项目在主轴上的对齐方式,我们需要在使用之前确定好主轴是哪个

flex-wrap:设置子元素是否换行

默认情况下,项目都排在一条线上(轴线),flex-wrap属性定义,flex布局中默认不换行

align-items   设置侧轴上的子元素排列方式(单行!!!)

该属性是控制子项在侧轴(默认是Y轴)上的排列方式,在子项为单项的时候使用。

align-content 设置侧轴上的子元素的排列方式(多行)

该属性设置子项在侧轴上的排列方式,并且只能用于子项出现换行的情况(多行!!!),在单行下没有效果

flex-flow

flex-flow 是flex-direction和flex-wrap的复合属性。

flex布局 父元素常见属性相关教程

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值