10个以内icon 两排局中平分显示,特殊处理6、7、8个的情况
.icons{
width: 100%;
padding-bottom: 30rpx;
background-color: #FFFFFF;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-evenly;
}
.icons-item{
height: 130rpx;
margin-top: 30rpx;
box-sizing: border-box;
width: 20%;
}
.icons-item image{
width: 90rpx;
height: 90rpx;
display: block;
margin: 0 auto;
border-radius: 50%;
border: 1rpx solid red;
}
.icons-item view{
width: 100%;
text-align: center;
font-size: 26rpx;
color: #303133;
height: 26rpx;
line-height: 26rpx;
margin-top: 15rpx;
}
/* 每一排显示5个 4个 3个 单独处理 */
.icons-item.five{
width: 20%;
}
.icons-item.four{
width: 25%;
}
.icons-item.three{
width: 33.3%;
}