.container { background-color: #fff; } .bannerBox { width: calc(100% - 40rpx); height: 300rpx; margin: 0 20rpx; border-radius: 20rpx; box-shadow: 0px 22px 10px -20px #c7c7c7; position: absolute; top: 0; left: 0; } .swiper { height: 100%; border-radius: 20rpx; } .swiperItem { border-radius: 20rpx; } .swiperImg { display: block; width: 100%; height: 100%; border-radius: 20rpx; } .contentBox { height: calc(100vh - 330rpx); margin-top: 320rpx; padding: 10rpx 20rpx 0; position: relative; z-index: 9; background-color: #fff; overflow-y: auto; } .operateBox { display: flex; justify-content: space-between; align-items: center; flex-flow: wrap; align-content: flex-start; } .operateItemBox { display: inline-block; width: calc(50% - 10rpx); padding-bottom: 20rpx; } .operateItem { display: inline-block; width: 100%; height: 100%; text-align: center; border-radius: 14rpx; position: relative; } .operateItemBGImg { width: 100%; height: 100%; } .operateItemText { position: absolute; bottom: 10%; left: 0rpx; width: calc(100% - 40rpx); padding: 0 20rpx; text-align: center; font-size: 22rpx; height: 64rpx; line-height: 32rpx; color: #777; white-space: pre-line; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .container { background-color: #fff; } .contentBox { height: calc(100vh - 20rpx); padding: 20rpx 20rpx 0; position: relative; z-index: 9; background-color: #fff; overflow-y: auto; } .operateBox { display: flex; justify-content: space-between; align-items: center; flex-flow: wrap; align-content: flex-start; } .operateItemBox { display: inline-block; width: calc(50% - 10rpx); padding-bottom: 20rpx; } .operateItem { display: inline-block; width: 100%; height: 100%; text-align: center; border-radius: 14rpx; position: relative; } .operateItemBGImg { width: 100%; height: 100%; } .operateItemText { position: absolute; bottom: 10%; left: 0rpx; width: calc(100% - 40rpx); padding: 0 20rpx; text-align: center; font-size: 32rpx; line-height: 42rpx; color: #000; white-space: pre-line; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } /* 自定提示弹窗 */ .popMask { position: fixed; left: 0; top: 0; right: 0; bottom: 0; display: flex; justify-content: center; align-items: center; background-color: rgba(0, 0, 0, 0.2); line-height: 1 !important; z-index: 99; } .popContent { width: 80%; line-height: 1 !important; } .popTips { width: 100%; font-size: 36rpx; color: #333; font-weight: bold; text-align: center; padding: 30rpx 0 10rpx; line-height: 1 !important; background-color: #fff; border-radius: 30rpx 30rpx 0 0; } .popBody { width: calc(100% - 40rpx); padding: 20rpx; font-size: 24rpx; color: #333; line-height: 1.5 !important; background-color: #fff; max-height: 600rpx; overflow-y: auto; word-break: break-all; } .popBtn { width: 100%; padding: 30rpx 0; text-align: center; font-size: 30rpx; letter-spacing: 2rpx; line-height: 1 !important; background-color: #fff; color: #3e6ffd; border-top: 2rpx #ebebeb solid; border-radius: 0 0 30rpx 30rpx; }