flex

flex-direction:row 子元素要设置width或flex;若只设width未设flex,父元素宽度不够,且默认不换行,则子元素按比例显示,子元素只被调整宽度,未设高度则填充;
flex-direction:column 同样
flex优先级高于width\height

若flex-direction:column align-items:center 才能实现左右居中
若要实现多行展示图片之类,就不能给每个图片设置flex:n;只能设置固定宽度/另一种就是flex:1 1 n%;

display:-webkit-flex
-webkit-flex-wrap //nowrap(default)/wrap/wrap-reverse
flex-direction //row(default) /row-reverse/ column /column-reverse
flex-flow //flex-direction -webkit-flex-wrap
justify-content //flex-start/flex-end/center/space-between/space-around
align-self //flex-start/flex-end/center
align-items //flex-start/flex-end/center/baseline/stretch
order //number 排序
align-content //flex-start/flex-end/center/space-between/space-around/stretch

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值