移动web第四天--flex布局

1.改变主轴方向为垂直方向

改变主轴方向为垂直方向 fd
flex-direction: column;

把主轴方向变成了垂直方向,还是用jc控制主轴方向的对齐方式
把侧轴方向变成了水平方向,还是用ai控制侧轴方向的对齐方式
    注意:主轴和侧轴仅仅只是调换了方向而已
Snipaste_2022-04-06_09-09-40.png

2.弹性盒子换行显示( flex-wrap: wrap;)

默认弹性容器高度被换行的弹性盒子均等分

align-content

1.取值和jc取值是一样的
2.针对于多行弹性盒子的侧轴设置的
3.出现的前提条件,必须要先换行 flex-wrap: wrap;


Snipaste_2022-04-06_09-27-00.png

align-items 针对于单行弹性盒子的侧轴对齐方式

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容