持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第20天，点击查看活动详情
今天来了解CSS属性之Flex属性深入！ 有几个问题想提问大家：昨天我们学习了基础的flex弹性盒的属性
那么如何定义项目在主轴上的对齐方式？如何定义项目在交叉轴上如何对齐？
让我们今天一起来学习更深入的flex属性知识吧～
justify-content属性
justify-content属性定义了项目在主轴上的对齐方式
.box {
justify-content: flex-start | flex-end | center | space-between | space-around;
}
可能取以下几个值（假设主轴从左到右～）
flex-start：默认值，左对齐flex-end：右对齐center： 居中space-between：两端对齐，项目之间的间隔都相等space-around：每个项目两侧的间隔相等
align-items属性
align-items属性定义项目在交叉轴上如何对齐
.box {
align-items: flex-start | flex-end | center | baseline | stretch;
}
可能取以下几个值（假设交叉轴轴从上到下～）
flex-start：交叉轴的起点对齐。flex-end：交叉轴的终点对齐。center：交叉轴的中点对齐。baseline: 项目的第一行文字的基线对齐。stretch：默认，且如果项目未设置高度或设为auto，将占满整个容器的高度
特别地：align-content属性
align-content属性定义了多根轴线的对齐方式，特别地：如果项目只有一根轴线，该属性不起作用
.box {
align-content: flex-start | flex-end | center | space-between | space-around | stretch;
}
可能取以下几个值
flex-start：交叉轴起点对齐flex-end：交叉轴终点对齐center：交叉轴中点对齐space-between：交叉轴两端对齐，轴线之间间隔平均分布space-around：每根轴线两侧的间隔都相等stretch：默认，轴线占满整个交叉轴
写在最后
重新开始更文啦！最近忙了一段时间，终于继续可以学习！感谢大家的支持！我会继续努力坚持学习！养成了好习惯，每天必定会抽出时间多多少少学习前端知识～
以上习题&笔记从大佬们的论坛学习而来，特感谢大佬们的知识分享～ （学习技术知识，果然要看大佬们的技术博客，大家有好的推荐也欢迎指引我这个小白哈，感恩！）
附上学习链接，感谢这些大佬出题和解答：
