css3中弹性布局flex简单总结1
1 普通情况下的效果
代码:
效果:
2 添加弹性布局
效果:
3 设置为垂直排放
添加的代码如下:
效果:
4 设置为水平居中显示
效果:
5 设置为垂直方向居中显示
效果:
6 进行换行
flex-wrap: wrap; /*换行*/
7 justify-content: space-between的使用效果:
8 justify-content: space-around的使用效果:
1 普通情况下的效果
代码:
效果:
2 添加弹性布局
效果:
3 设置为垂直排放
添加的代码如下:
效果:
4 设置为水平居中显示
效果:
5 设置为垂直方向居中显示
效果:
6 进行换行
flex-wrap: wrap; /*换行*/
7 justify-content: space-between的使用效果:
8 justify-content: space-around的使用效果: