.Box{ min-height: 100vh; position: relative; } .backImg{ width: 100%; height: 380rpx; } .headImg{ position: absolute; border: 1rpx solid #07E881; width: 160rpx; height: 160rpx; border-radius: 50%; top: 320rpx; left: 50rpx; } .category{ position: absolute; top: 410rpx; left: 260rpx; padding: 20rpx; border-radius: 10rpx; background-color: #222735; text-align: center; line-height: 32rpx; } .nameBox{ margin-top: 150rpx; } .userName{ height: 50rpx; font-size: 40rpx; font-family: PingFang SC; font-weight: 800; color: #FFFFFF; text-align:center; float: left; margin-left: 20px; } .text{ width: 90%; margin: 20rpx auto; /* height: 120rpx; */ overflow: hidden; font-size: 28rpx; font-family: PingFang SC; font-weight: 500; color: #666D80; line-height: 36rpx; } .classifyBox{ height: 100rpx; background: #121620; } .singleBox{ float: left; margin-left: 40rpx; } .multiBox{ float: left; text-align: center; } .singleText{ font-size: 30rpx; font-family: OPPOSans; font-weight: 500; color: #97A1BD; line-height: 35rpx; padding: 10px 0; margin-left: 20rpx; } .singleText_a{ font-size: 30rpx; font-family: OPPOSans; font-weight: bold; color: #FFFFFF; line-height: 35rpx; padding: 10px 0; margin-left: 20rpx; border-bottom: 1rpx solid #07E881; } .classBox{ margin: 20rpx; } .classImg{ float: left; width: 300rpx; height: 200rpx; border-radius: 12rpx; } .textBox{ float: left; margin-left: 10px; } .titile{ width: 350rpx; height: 40rpx; line-height: 40rpx; font-size: 30rpx; font-family: PingFang SC; font-weight: 500; color: #FEFEFE; margin-bottom: 19rpx; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1 } .cont{ width: 360rpx; height: 30rpx; line-height: 30rpx; font-size: 26rpx; font-family: PingFang SC; font-weight: 400; color: #6E768A; font-weight: 560; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; } .moreBox{ margin-top: 20rpx; position: relative; } .user{ float: left; width: 50rpx; height: 50rpx; border-radius: 50%; background-color: beige; } .userText{ width: 200rpx; text-align: center; height: 50rpx; line-height: 50rpx; background: #222735; border-radius: 50rpx; font-family: PingFang SC; font-weight: 500; font-size: 26rpx; color: #8790A8; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1 } .incomeBox{ margin-top: 10rpx; } .money{ float: left; color: #ff3366; font-size: 28rpx; } .py{ font-size: 24rpx; float: left; color: #ff3366; } .moodsImg{ float: right; width: 30rpx; height: 30rpx; margin-top: 8rpx; /* background-color: cornflowerblue; */ } .moodsText{ float: right; color: #ffffff; margin: 0 10rpx; font-size: 22rpx; margin-top: 6rpx; } .moodsNum{ float: right; color: #00cc99; } .add{ width: 140rpx; height: 140rpx; position: fixed; right: 0; bottom: 274rpx; z-index: 10000; } .addBox{ padding: 0 40rpx; height: 100rpx; background: linear-gradient(0deg, #2A3042, #464D61); background-color: #2A3042; box-shadow: 0px 6px 20px 0px rgba(0, 0, 0, 0.93); border-radius: 49rpx; position: fixed; left: 5%; bottom: 300rpx; } .goruzu{ float: left; } .video{ width: 70rpx; height: 70rpx; float: left; margin-left: 40rpx; margin-top: 15rpx; } .checkImg{ width: 70rpx; height: 70rpx; float: left; margin-left: 80rpx; margin-top: 10rpx; } .issue{ float: left; font-size: 30rpx; font-family: OPPOSans; font-weight: bold; color: #FFFFFF; line-height: 100rpx; margin-left: 10rpx; } .xian{ height: 70rpx; width: 2rpx; background-color: rgba(255, 255, 255, 0.3); border-radius: 1px; float: left; margin-left: 80rpx; margin-top: 15rpx; } button::after { border: none; } button { background-color: transparent; padding-left: 0; padding-right: 0; line-height:inherit; } button { border-radius:0; }