index.wxss 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130
  1. .Wrapper.data-v-02281a80 {
  2. display: flex;
  3. align-items: center;
  4. gap: 10rpx;
  5. }
  6. .Wrapper-img.data-v-02281a80 {
  7. width: 50rpx;
  8. height: 50rpx;
  9. margin-left: 10rpx;
  10. }
  11. .Wrapper-content.data-v-02281a80 {
  12. color: rgba(16, 16, 16, 1);
  13. font-size: 25rpx;
  14. font-family: PingFangSC-regular;
  15. line-height: 20rpx;
  16. }
  17. .custom-swiper.data-v-02281a80 {
  18. width: 710rpx;
  19. height: 100rpx;
  20. margin-top: 20rpx;
  21. margin-left: 20rpx;
  22. }
  23. .Wrapper-grid.data-v-02281a80 {
  24. margin-top: 170rpx;
  25. }
  26. /* 图标样式 */
  27. .service-img.data-v-02281a80 {
  28. width: 80rpx;
  29. height: 80rpx;
  30. margin-bottom: 15rpx;
  31. }
  32. /* 文本样式 */
  33. .grid-text.data-v-02281a80 {
  34. font-size: 24rpx;
  35. color: #333;
  36. text-align: center;
  37. margin-top: 10rpx;
  38. }
  39. /* 文字样式 */
  40. /* .service-text {
  41. font-size: 24rpx;
  42. color: rgba(16, 16, 16, 1);
  43. text-align: center;
  44. } */
  45. .demo-warter.data-v-02281a80 {
  46. border-radius: 8px;
  47. margin: 5px;
  48. background-color: #ffffff;
  49. padding: 5px;
  50. /* position: relative; */
  51. }
  52. .container.data-v-02281a80 {
  53. padding: 10px;
  54. }
  55. /* 容器样式 */
  56. .container.data-v-02281a80 {
  57. padding: 20rpx;
  58. }
  59. /* 每个 item 使用 Flex 布局 */
  60. .item.data-v-02281a80 {
  61. display: flex;
  62. align-items: flex-start;
  63. margin-bottom: 30rpx;
  64. padding: 20rpx;
  65. border: 1rpx solid #eee;
  66. border-radius: 16rpx;
  67. }
  68. /* 图片固定宽度 */
  69. .image.data-v-02281a80 {
  70. width: 230rpx;
  71. height: 180rpx;
  72. border-radius: 8rpx;
  73. margin-right: 20rpx;
  74. }
  75. /* 中间部分:自动填充剩余空间 */
  76. .middle.data-v-02281a80 {
  77. flex: 1;
  78. margin-right: 20rpx;
  79. }
  80. /* 姓名样式 */
  81. .name.data-v-02281a80 {
  82. font-weight: bold;
  83. font-size: 32rpx;
  84. margin-bottom: 8rpx;
  85. }
  86. /* 分类样式 */
  87. .category.data-v-02281a80 {
  88. color: #666;
  89. font-size: 28rpx;
  90. margin-bottom: 8rpx;
  91. }
  92. .title.data-v-02281a80 {
  93. font-size: 28rpx;
  94. color: #888;
  95. line-height: 1.4;
  96. display: -webkit-box;
  97. -webkit-box-orient: vertical;
  98. -webkit-line-clamp: 2;
  99. overflow: hidden;
  100. text-overflow: ellipsis;
  101. word-break: break-all;
  102. /* 可选:长单词强制换行 */
  103. }
  104. /* 右侧:评分和按钮 */
  105. .right.data-v-02281a80 {
  106. display: flex;
  107. flex-direction: column;
  108. align-items: flex-end;
  109. min-width: 160rpx;
  110. }
  111. /* 评分样式 */
  112. .score.data-v-02281a80 {
  113. color: orange;
  114. font-size: 28rpx;
  115. margin-bottom: 10rpx;
  116. height: 120rpx;
  117. }