Html-字体图标、弹性布局的使用

flex-direction: column;column从上单下

1

2

3

justify-content: center; center:向主轴的中心位靠拢

1

2

3

justify-content:space-around;

space-around:平均分布，两边有距离，两边距离是中间的一半

1

2

3

justify-content:space-between;

space-between:平均分布，两边没有距离

1

2

3

justify-content:space-evenly;

space-evenly:(新)平均分布，两边都有距离，两边的距离和中间的是一样的

1

2

3

align-items: center;

设置测轴的内容分布

1

2

3

汇总：

1

2

3

1

2

3

1

2

3

1

2

3

1

2

3

1

2

3