资讯专栏INFORMATION COLUMN

align-content 与 align-items 区别

ASCH / 1317人阅读

摘要:和共同点它们对齐方向为交叉轴不同点应用于为多行而应用于单行。单行对齐例子多行对齐例子

align-content 和 align-items  :

1:共同点:它们对齐方向为交叉轴

2:不同点:align-content 应用于为 多行   而 align-items:应用于单行。

单行对齐例子:

display: flex;
justify-content: space-around;
align-items: center;

多行对齐例子

display: flex;
flex-wrap: wrap;
justify-content: space-around;
align-content: center;

 

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/1173.html

相关文章

  • Flex入坑指南

    摘要:我们给容器设置了宽度为为了方便的减去计算。这个属性用来设置元素在容器中所占据的宽度默认主轴方向,这个属性主要是用来让来计算容器是否还有剩余面积的。 弹性布局flex是一个几年前的CSS属性了,说它解放了一部分生产力不为过。至少解放了不少CSS布局相关的面试题 :) 之前网上流行的各种XX布局,什么postion: absolute+margin,float+padding,各种都可以...

    imccl 评论0 收藏0
  • Flex入坑指南

    摘要:我们给容器设置了宽度为为了方便的减去计算。这个属性用来设置元素在容器中所占据的宽度默认主轴方向,这个属性主要是用来让来计算容器是否还有剩余面积的。弹性布局flex是一个几年前的CSS属性了,说它解放了一部分生产力不为过。至少解放了不少CSS布局相关的面试题 :) 之前网上流行的各种XX布局,什么postion: absolute+margin,float+padding,各种都可以使用fle...

    番茄西红柿 评论0 收藏0
  • Flex布局做出自适应页面--语法和案例

    摘要:布局中的基本概念采用布局的元素,称为容器,简称容器。它的所有子元素自动成为容器成员,称为项目,简称项目。容器默认存在两根轴水平的主轴和垂直的侧轴。例如同时给项目设置属性,则项目的实际宽度是属性属性是和的简写,默认值为。 本文发布在:github项目地址:https://github.com/tenadolant...SegmentFault地址:https://segmentfault...

    lewinlee 评论0 收藏0
  • Flex布局做出自适应页面--语法和案例

    摘要:布局中的基本概念采用布局的元素,称为容器,简称容器。它的所有子元素自动成为容器成员,称为项目,简称项目。容器默认存在两根轴水平的主轴和垂直的侧轴。例如同时给项目设置属性,则项目的实际宽度是属性属性是和的简写,默认值为。 本文发布在:github项目地址:https://github.com/tenadolant...SegmentFault地址:https://segmentfault...

    wujl596 评论0 收藏0

发表评论

0条评论

ASCH

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<