index.wxss 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. /* banner */
  2. .homeBanner {
  3. width: 100vw;
  4. height: 306rpx;
  5. background-color: #FFFFFF;
  6. }
  7. .swiperBanner {
  8. width: 702rpx;
  9. height: 286rpx;
  10. padding-top: 20rpx;
  11. margin: 0 auto;
  12. border-radius: 10rpx;
  13. overflow: hidden;
  14. }
  15. .swiperBanner swiper-item,
  16. .swiperBanner image {
  17. width: 100%;
  18. height: 100%;
  19. }
  20. /* 数据展示 */
  21. .data-display {
  22. display: flex;
  23. justify-content: space-around;
  24. width: 100vw;
  25. height: 142rpx;
  26. background-color: #FFFFFF;
  27. padding: 0 30rpx;
  28. box-sizing: border-box;
  29. text-align: center;
  30. }
  31. .data-display-title {
  32. font-size: 24rpx;
  33. color: #333333;
  34. line-height: 34rpx;
  35. opacity: .7;
  36. margin-top: 20rpx;
  37. }
  38. .data-display-num {
  39. font-size: 42rpx;
  40. font-weight: 500;
  41. color: #4DC2D4;
  42. line-height: 58rpx;
  43. margin-top: 10rpx;
  44. }
  45. .display-title_image {
  46. width: 32rpx;
  47. height: 32rpx;
  48. margin: 0 6rpx;
  49. }
  50. /* 直播大厅和热门展商 */
  51. .exhibition-swiper {
  52. height: 700rpx;
  53. }
  54. .exhibition-swiper-item {
  55. display: flex;
  56. justify-content: space-around;
  57. flex-wrap: wrap;
  58. height: 650rpx !important;
  59. }
  60. /* 盒子 */
  61. .exhibition {
  62. display: flex;
  63. flex-direction: column;
  64. width: 322rpx;
  65. height: 308rpx;
  66. background: #FFFFFF;
  67. box-shadow: 10rpx 10rpx 20rpx 0px rgba(0, 0, 0, 0.05);
  68. border-radius: 10rpx;
  69. border: 2rpx solid rgba(0, 0, 0, 0.05);
  70. overflow: hidden;
  71. }
  72. .exhibition-img {
  73. width: 100%;
  74. height: 240rpx;
  75. box-shadow: 10rpx 10rpx 20rpx 0px rgba(0, 0, 0, 0.05);
  76. }
  77. .exhibition-bottom {
  78. flex: 1;
  79. width: 100%;
  80. display: flex;
  81. justify-content: space-between;
  82. align-items: center;
  83. padding: 0 12rpx;
  84. box-sizing: border-box;
  85. }
  86. .exhibition-bottom-title {
  87. font-size: 28rpx;
  88. color: #000000;
  89. }
  90. .exhibition-bottom-data{
  91. font-size: 24rpx;
  92. font-weight: 500;
  93. color: #4DC2D4;
  94. }