.Box{ height: 100vh; overflow: scroll; min-height: 100vh; } .searchF{ width: 80%; height: 80rpx; background-color: rgba(51, 51, 51, 0.5); border-radius: 60rpx; margin: 20rpx; float: left; } .searchText{ width: 80%; margin: 0 auto; height: 100%; color: #ffffff; } .searchBtn{ width: 10%; line-height: 100rpx; color: #00ff99; float: left; height: 100rpx; margin-top: 10rpx; font-size: 30rpx; } .recommendBox{ margin: 40rpx 0; } .recommendLogo{ float: left; width: 60rpx; height: 60rpx; background-color: #00ff99; } .recommendText{ color: #ffffff; font-size: 32rpx; line-height: 60rpx; margin-left: 20rpx; float: left; } .recommend{ display: flex; justify-content: space-between; flex-wrap:wrap; } .recommendItem{ width: 40%; margin: 20rpx 5%; background-color: rgba(51, 51, 51, 0.5); border-radius: 50rpx; text-align: center; line-height: 80rpx; height: 80rpx; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; color: #ffffff; text-indent:10rpx } .authorItemBox{ margin: 20rpx 0; overflow: hidden; overflow-y: hidden; overflow-x: auto; white-space: nowrap; } .authorItemBox::-webkit-scrollbar { display: none; } .authorItem{ width: 30%; height: 340rpx; border-radius: 10rpx; background-color: #333; overflow: hidden; display: inline-block; margin-right:20rpx; } .portrait{ width: 150rpx; height: 150rpx; background-color: azure; border-radius: 50%; margin: 20rpx auto; } .name{ line-height: 72rpx; text-align: center; color: #ffffff; font-size: 36rpx; text-align: center; } .categoryBox{ display: flex; justify-content: center; } .categoryTtem{ width: 40%; margin: 0 5%; border-radius: 30rpx; border: 2rpx solid #00ff99; text-align: center; color: #00ff99; height: 50rpx; line-height: 50rpx; } /* 暂时填充 */ .author { height: 600rpx; } .course{ width: 20%; float: left; text-align: center; padding-bottom:20rpx; } .titleA{ font-size: 36rpx; line-height: 70rpx; color: #07E881; font-family: PingFang SC; font-weight: 800; } .title{ line-height: 70rpx; color: #ffffff; } .xian{ width: 40%; margin: 0 auto; height: 2rpx; background-color: #07E881; } .cAuthor{ width: 20%; float: left; text-align: center; } .classBox { width: 90%; margin:20rpx auto; border-bottom: #666666 1rpx dotted; } .orderBidBox{ border-radius: 20rpx; background-color: #181C28; margin: 40rpx 0; } .img{ float: left; width: 250rpx; height: 160rpx; border-radius: 10rpx; } .courseBox { width: 360rpx; margin-left: 30rpx; float: left; } .h3{ width: 360rpx; line-height: 60rpx; font-size: 34rpx; color: #ffffff; font-weight: 560; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; } .headImg{ width: 60rpx; height: 60rpx; border-radius: 50%; background-color: coral; float: left; } .name{ width: 220rpx; line-height: 60rpx; height: 60rpx; border-radius: 50rpx; color: #8790A8; text-align: center; background-color: #222735; } .priceBox{ /* margin-top: 20rpx; */ overflow: hidden; } .priceF{ float: left; color: #ff3366; line-height: 60rpx; } .price{ font-size: 34rpx; color: #ff3366; float: left; line-height: 60rpx; } .timeBox{ width: 90%; margin: 20rpx auto; } .payTiem{ float: left; line-height: 80rpx; font-size: 32rpx; font-family: PingFang SC; font-weight: 500; color: #FC4758; } .payBtn{ float: right; width: 180rpx; line-height: 80rpx; text-align: center; border: 2rpx solid #06D176; border-radius: 50rpx; color: #06D176; } .userHead{ float: left; width: 120rpx; height: 120rpx; background-color: aqua; border-radius: 50%; margin: 20rpx; } .userNameBox{ float: left; margin: 20rpx; } .userName{ width: 300rpx; line-height: 60rpx; margin: 10rpx; color: #fff; font-size: 30rpx; } .typeBox{ margin: 0 10rpx; } .shuXian{ float: left; width: 1rpx; margin: 0 20rpx; background-color: #31335C; height: 40rpx; } .type{ float: left; } .bean{ float: left; } .attentionBox{ float: left; margin: 40rpx 20rpx; border: 1rpx solid #07E881; width: 130rpx; height: 70rpx; line-height: 70rpx; border-radius: 40rpx; background: rgba(7, 232, 129, 0.12); text-align: center; color: #07E881; } .attentionBoxHie{ float: left; margin: 40rpx 20rpx; border: 1rpx solid #666666; width: 130rpx; height: 70rpx; line-height: 70rpx; border-radius: 40rpx; text-align: center; color: #666666; } .noDataBox{ width: 100%; height: 600rpx; top: 300rpx; left: 0; background-color: #0E1119; } .noDataImg{ width: 500rpx; height: 400rpx; }