flex弹性布局 笔记2

布局"项目"的父级属性创建弹性盒子，用display:flex或display:inline-flex，类似于 display:block || inline-block。就是这个容器是块级元素还是行内快元素，一般都是设置display:flex。

弹性布局的基本概念包括：

• 主轴：在弹性布局中，子元素在主轴上的排列方向可以是水平或垂直，这可以通过flex-direction属性来规定。
• 交叉轴：与主轴垂直的另一方向，称为交叉轴。
• 弹性容器的直接子元素：会受到弹性布局的影响，成为弹性项目。

弹性布局的属性包括：

1. flex-direction：决定子元素在主轴上的排列方向，如从左往右或从上往下。
2. flex-wrap：子元素的换行显示方式，如nowrap（不换行）、wrap（多行显示）和wrap-reverse（反向多行显示）。
3. justify-content：子元素在主轴上的对齐方式，如flex-start（起点对齐）、flex-end（终点对齐）、center（居中对齐）等。