You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

187 line
3.2 KiB

  1. .Box{
  2. min-height: 100vh;
  3. position: relative;
  4. }
  5. .backImg{
  6. width: 100%;
  7. height: 400rpx;
  8. }
  9. .headImg{
  10. position: absolute;
  11. border: 1rpx solid #07E881;
  12. width: 200rpx;
  13. height: 200rpx;
  14. border-radius: 50%;
  15. top: 480rpx;
  16. left: 50rpx;
  17. }
  18. .category{
  19. position: absolute;
  20. top: 560rpx;
  21. left: 300rpx;
  22. padding: 20rpx;
  23. border-radius: 10rpx;
  24. background-color: #222735;
  25. text-align: center;
  26. line-height: 32rpx;
  27. }
  28. .nameBox{
  29. margin-top: 180rpx;
  30. }
  31. .userName{
  32. height: 50rpx;
  33. font-size: 40rpx;
  34. font-family: PingFang SC;
  35. font-weight: 800;
  36. color: #FFFFFF;
  37. text-align:center;
  38. float: left;
  39. margin-left: 20px;
  40. }
  41. .text{
  42. width: 90%;
  43. margin: 20rpx auto;
  44. height: 120rpx;
  45. overflow: hidden;
  46. font-size: 28rpx;
  47. font-family: PingFang SC;
  48. font-weight: 500;
  49. color: #666D80;
  50. line-height: 36rpx;
  51. }
  52. .classifyBox{
  53. height: 120rpx;
  54. background: #121620;
  55. }
  56. .singleBox{
  57. float: left;
  58. margin-left: 30rpx;
  59. }
  60. .multiBox{
  61. float: left;
  62. text-align: center;
  63. }
  64. .singleXian{
  65. width: 60rpx;
  66. height: 2rpx;
  67. background-color: #07E881;
  68. margin-left: 20rpx;
  69. }
  70. .singleText{
  71. font-size: 30rpx;
  72. font-family: OPPOSans;
  73. font-weight: 500;
  74. color: #97A1BD;
  75. line-height: 35rpx;
  76. padding: 10px 0;
  77. margin-left: 20rpx;
  78. }
  79. .singleText_a{
  80. font-size: 30rpx;
  81. font-family: OPPOSans;
  82. font-weight: bold;
  83. color: #FFFFFF;
  84. line-height: 35rpx;
  85. padding: 10px 0;
  86. margin-left: 20rpx;
  87. }
  88. .classBox{
  89. margin: 20rpx;
  90. }
  91. .classImg{
  92. float: left;
  93. width: 300rpx;
  94. height: 200rpx;
  95. border-radius: 12rpx;
  96. }
  97. .textBox{
  98. float: left;
  99. margin-left: 10px;
  100. }
  101. .titile{
  102. width: 350rpx;
  103. height: 40rpx;
  104. line-height: 40rpx;
  105. font-size: 30rpx;
  106. font-family: PingFang SC;
  107. font-weight: 500;
  108. color: #FEFEFE;
  109. margin-bottom: 19rpx;
  110. overflow:hidden;
  111. text-overflow:ellipsis;
  112. display:-webkit-box;
  113. -webkit-box-orient:vertical;
  114. -webkit-line-clamp:1
  115. }
  116. .cont{
  117. width: 360rpx;
  118. height: 30rpx;
  119. line-height: 30rpx;
  120. font-size: 26rpx;
  121. font-family: PingFang SC;
  122. font-weight: 400;
  123. color: #6E768A;
  124. font-weight: 560;
  125. overflow:hidden;
  126. text-overflow:ellipsis;
  127. display:-webkit-box;
  128. -webkit-box-orient:vertical;
  129. -webkit-line-clamp:1;
  130. }
  131. .moreBox{
  132. margin-top: 20rpx;
  133. position: relative;
  134. }
  135. .user{
  136. float: left;
  137. width: 50rpx;
  138. height: 50rpx;
  139. border-radius: 50%;
  140. background-color: beige;
  141. }
  142. .userText{
  143. width: 200rpx;
  144. text-align: center;
  145. height: 50rpx;
  146. line-height: 50rpx;
  147. background: #222735;
  148. border-radius: 50rpx;
  149. font-family: PingFang SC;
  150. font-weight: 500;
  151. font-size: 26rpx;
  152. color: #8790A8;
  153. }
  154. .incomeBox{
  155. margin-top: 10rpx;
  156. }
  157. .money{
  158. float: left;
  159. color: #ff3366;
  160. font-size: 28rpx;
  161. }
  162. .py{
  163. font-size: 24rpx;
  164. float: left;
  165. color: #ff3366;
  166. }
  167. .moodsImg{
  168. float: right;
  169. width: 30rpx;
  170. height: 30rpx;
  171. margin-top: 8rpx;
  172. /* background-color: cornflowerblue; */
  173. }
  174. .moodsText{
  175. float: right;
  176. color: #ffffff;
  177. margin: 0 10rpx;
  178. font-size: 22rpx;
  179. margin-top: 6rpx;
  180. }
  181. .moodsNum{
  182. float: right;
  183. color: #00cc99;
  184. }