主轴默认是水平方向, 侧轴默认是垂直方向
修改主轴方向属性: flex-direction
属性值 | 作用 |
---|---|
row |
行, 水平(默认值) |
column |
*列, 垂直 |
row-reverse | 行, 从右向左 |
column-reverse | 列, 从下向上 |
语法:
flex-direction:column;
.box {
width: 400px;
height: 400px;
background-color: rebeccapurple;
margin: 100px auto;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.box div {
width: 100px;
height: 100px;
background-color: aqua;
}
修改完毕,主轴是Y轴, 侧轴是X轴
弹性盒子换行
特性ÿ