Flex弹性布局的一般特性(二)

清除内外边距后再自己画样式比较方便察看

*{margin:0;padding:0}

长江后浪推前浪,后浪死在沙滩上

flex布局的诞生几乎代替了float的一般应用,假如你很喜欢用float,为了更好的贴合实际还是要转变一下观念多用用flex的呢,诗和远方,越远越脏~

just-content调整主轴方向排列(有水平垂直两种主轴哦!)居中的话一般还加个align-item:center 纵横都居中 就是水平垂直居中啦

margin:0px空格auto只能水平居中啦!不是我在水字数(真的不是

just-content:space-around 这个排列方式就是父元素把子元素包起来通过相等的间隔和均匀的分布突出子元素的排列方式

水平方向两端对齐垂直方向居中和水平垂直居中是不一样的!水平垂直居中的子元素会聚在一起,看起来就像一个整体。两端对齐垂直居中的子元素会在中间从主轴方向头到尾分成子元素数量的多个单位,头和尾优先!

flex里面不给高度怎么居中呢? 给padding 上下x左右零呀 ?也可以叭, 如果感觉space-around后的文字排列过于紧凑了也可以尝试调大高度哦

align-content:多轴线对齐值跟justify-content不一样,不一样!

align-content:center、flex-end、flex-start、space-around、space-between、stretch

<
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值