flex布局最后一行靠左对其

 有时候会遇到这样的情况,最后一行不够,用了弹性布局,居中了
flex布局最后一行靠左对其_第1张图片解决方法:

.contact {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;/*靠左对其*/
}
.contact > view:nth-child(odd) {
	margin: 20rpx 15rpx 0 30rpx;/*给奇数项设置*//*nth-child是从1开始!!!*/
}
.contact > view:nth-child(even) {
	margin: 20rpx 30rpx 0 15rpx;/*给偶数项设置*/
}
.shop {
	width: 330rpx;
	height: 400rpx;
	background-color: #ffffff;
	border-radius: 10rpx;
	box-shadow: 1px 1px 1px #b1a7a7;
	padding: 10rpx;
	box-sizing: border-box;
}

效果图:
flex布局最后一行靠左对其_第2张图片

你可能感兴趣的:(布局)