page { background: #f7f7f7; } .preload-project-item { margin-top: 20rpx; margin-left: 20rpx; width: calc(100% - 40rpx); background: #fff; box-sizing: border-box; border-radius: 16rpx; padding: 0rpx 22rpx; overflow: hidden; } .preload-project-item .item-list { height: 100rpx; width: 100%; border-bottom: 1rpx solid #EAEAEA; display: flex; justify-content: space-between; align-items: center; } .preload-project-item .item-list:last-child { border: none; } .preload-project-item .left { height: 30rpx; width: 190rpx; border-radius: 8rpx; background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%); animation: loading 1.4s ease infinite; background-size: 400% 100%; } .preload-project-item .right { height: 30rpx; width: 325rpx; border-radius: 8rpx; background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%); animation: loading 1.4s ease infinite; background-size: 400% 100%; } .item-list-last { height: 100rpx; width: 100%; display: flex; justify-content: space-between; align-items: center; } .bottom { width: 100%; height: 160rpx; display: flex; justify-content: space-between; align-items: center; } .bottom .bottom-every { width: 220rpx; height: 160rpx; border-radius: 8rpx; background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%); animation: loading 1.4s ease infinite; background-size: 400% 100%; } .paddingBottom { padding-bottom: 35rpx; } @keyframes loading { 0% { background-position: 100% 50% } 100% { background-position: 0 50% } }