刚开始以为是 justify-content : center 设置为 居中... 的确,,当 元素满了时 的确能 居中.但是 当只有一个元素时,这一个元素也会居中...
想了半天没找到方法..突然发现
- justify-content: space-between
当设置成 两端对齐时, 然后 给 父容器一个 margin 不就好了吗..唉,没动脑子------
一个典型的 flex 布局例子.....↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
父容器:
.goods-item-container {
display: flex;
flex-wrap: wrap;
margin: 6px 6px;
justify-content: space-between;
}
子容器:
.goods-item {
30%;
height: 156px;
box-shadow: 1px 2px 3px 1px #888888;
margin: 5px;
overflow: hidden;
border-radius: 3px;
}