微信小程序九宫格布局css

 

微信小程序九宫格布局css

 

.grid-list{
  display: flex;
  flex-wrap: wrap;
  border-left: 1rpx solid #efefef;
  border-top: 1rpx solid #efefef;
}

.grid-item{
  width:33.33%;
  height:200rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-right: 1rpx solid #efefef;
  border-bottom: 1rpx solid #efefef;
  box-sizing: border-box;
}

.grid-img{
  width:120rpx;
  height:120rpx;
}

.grid-text{
  font-size:16rpx;
}

 

 

########################