东风启辰小程序端
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.

150 lines
2.4KB

  1. /* pages/star/star.wxss */
  2. .home {
  3. position: relative;
  4. height: 100%;
  5. overflow: hidden;
  6. }
  7. .home>.bg {
  8. position: absolute;
  9. bottom: 0;
  10. width: 750rpx;
  11. height: 1353rpx;
  12. }
  13. .home>.logo1 {
  14. position: absolute;
  15. top: 0;
  16. left: 60rpx;
  17. width: 175rpx;
  18. height: 150rpx;
  19. }
  20. .home>.logo2 {
  21. position: absolute;
  22. top: 46rpx;
  23. right: 34rpx;
  24. width: 204rpx;
  25. height: 40rpx;
  26. }
  27. .ruleBtn {
  28. position: absolute;
  29. width: 153rpx;
  30. height: 46rpx;
  31. line-height: 46rpx;
  32. font-size: 24rpx;
  33. right: 0;
  34. top: 196rpx;
  35. color: #fff;
  36. background-color: rgba(35, 24, 21, 0.63);
  37. border-top-left-radius: 20rpx;
  38. border-bottom-left-radius: 20rpx;
  39. padding-left: 20rpx;
  40. box-sizing: border-box;
  41. }
  42. .propagandaBox {
  43. position: absolute;
  44. width: 100%;
  45. height: 76rpx;
  46. bottom: 457rpx;
  47. left: 0;
  48. display: flex;
  49. justify-content: center;
  50. align-items: center;
  51. background-color: rgba(11, 40, 109, 0.79);
  52. }
  53. .propagandaBox>.text{
  54. color: #ffffff;
  55. font-size: 28rpx;
  56. }
  57. .numBox{
  58. display: inline-block;
  59. height: 55rpx;
  60. padding: 0 15rpx;
  61. }
  62. .numBox>.numFrame{
  63. width: 42rpx;
  64. height: 100%;
  65. display: inline-block;
  66. }
  67. .numBox>.numFrame2{
  68. width: 42rpx;
  69. height: 100%;
  70. margin-left: -42rpx;
  71. display: inline-block;
  72. }
  73. .home>.btnBox {
  74. position: absolute;
  75. width: 100%;
  76. text-align: center;
  77. left: 0;
  78. bottom: 15rpx;
  79. }
  80. .home>.btnBox>.btn {
  81. width: 278rpx;
  82. height: 47rpx;
  83. line-height: 47rpx;
  84. display: inline-block;
  85. background-color: #345489;
  86. margin: 0 10rpx;
  87. color: #fff;
  88. font-size: 21rpx;
  89. border-radius: 15rpx;
  90. }
  91. .home>.btnBox>.btn2 {
  92. position: absolute;
  93. width: 278rpx;
  94. height: 47rpx;
  95. left: 50%;
  96. margin-left: -282rpx;
  97. background-color: #000000;
  98. display: inline-block;
  99. opacity:0
  100. }
  101. .mask {
  102. position: absolute;
  103. left: 0;
  104. top: 0;
  105. width: 100%;
  106. height: 100%;
  107. display: flex;
  108. align-items: center;
  109. justify-content: center;
  110. background-color: rgba(0, 0, 0, 0.5);
  111. }
  112. .mask>.ruleContent {
  113. position: relative;
  114. width: 562rpx;
  115. height: 971rpx;
  116. border-radius: 20rpx;
  117. background-color: #ffffff;
  118. }
  119. .mask>.ruleContent>.rule {
  120. position: relative;
  121. width: 100%;
  122. height: 100%;
  123. }
  124. .closeBtn {
  125. position: absolute;
  126. height: 40rpx;
  127. width: 40rpx;
  128. right:-40rpx;
  129. top:-40rpx;
  130. }
  131. /* use cross as close button */
  132. /* .closeBtn::before {
  133. content: "\2716";
  134. } */