.change-grid { width: 100%; height: 100vh; background: #f7f7f7; } .nav { height: 94rpx; background: #ffffff; width: 100%; display: flex; justify-content: space-between; align-items: center; } .nav .nav-left image { width: 32rpx; height: 32rpx; margin: 0 9rpx 0 20rpx; } .nav .nav-left text { font-size: 32rpx; font-weight: bold; color: #f13d3c; } .nav .nav-right { font-size: 26rpx; color: #999; margin-right: 20rpx; } .grid-list { width: 100%; box-sizing: border-box; padding: 20rpx; height: auto; } .grid-list .content { width: 100%; height: 100%; background: #ffffff; border-radius: 16rpx; box-sizing: border-box; padding: 0 23rpx; } .grid-list .grid-item { height: 100rpx; width: 100%; display: flex; justify-content: space-between; align-items: center; } .content > .grid-item + .grid-item { border-top: 1rpx solid #eaeaea; } .grid-list .grid-item .name { font-size: 34rpx; color: #333; } .grid-list .grid-item .enter { width:80rpx; height:40rpx; border: 1rpx solid #C0C0C0; border-radius:4px; line-height: 40rpx; font-size: 24rpx; color: #aeaeae; text-align:center; }