Nav apraksta

choose_city.css 3.6KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205
  1. html {
  2. background-color: #f3f3f3;
  3. font-size: 100px;
  4. }
  5. nav {
  6. position: fixed;
  7. top: 0;
  8. left: 0;
  9. z-index: 9999;
  10. font-size: 0rem;
  11. height: 0.44rem;
  12. width: 100%;
  13. background-color: #5d7dff;
  14. }
  15. nav i {
  16. display: inline-block;
  17. width: 0.16rem;
  18. height: 0.16rem;
  19. line-height: 0.44rem;
  20. margin-left: 0.1rem;
  21. background-image: url(../img/back.png);
  22. background-repeat: no-repeat;
  23. background-size: 100% auto;
  24. }
  25. nav p {
  26. display: inline-block;
  27. width: 90%;
  28. text-align: center;
  29. line-height: 0.44rem;
  30. color: #fff;
  31. font-size: 0.17rem;
  32. }
  33. .current-city-wrapper {
  34. margin: 0.54rem 0.10rem 0;
  35. margin-top: 0.54rem;
  36. }
  37. .current-city-wrapper>p {
  38. color: #444;
  39. font-size: 0.12rem;
  40. margin-top: 0.10rem;
  41. }
  42. .current-city {
  43. margin-top: 0.12rem;
  44. width: 100%;
  45. height: 0.40rem;
  46. background-color: #fff;
  47. position: relative;
  48. font-size: 0;
  49. }
  50. .current-city span {
  51. margin-left: 0.10rem;
  52. font-size: 0.16rem;
  53. line-height: 0.40rem;
  54. color: #222;
  55. font-weight: bold;
  56. }
  57. .current-city i {
  58. display: inline-block;
  59. background-image: url(../img/location2.png);
  60. background-size: 100%;
  61. width: 0.26rem;
  62. height: 0.26rem;
  63. position: absolute;
  64. right: 0.10rem;
  65. top: 50%;
  66. transform: translateY(-50%);
  67. }
  68. .city-list-wrapper {
  69. position: relative;
  70. }
  71. .city-list-content {
  72. margin: 0.10rem 0.30rem 0 0.1rem;
  73. }
  74. .city-list-hot-wrapper p {
  75. color: #444;
  76. font-size: 0.12rem;
  77. margin-top: 0.12rem;
  78. }
  79. .city-list-hot {
  80. margin-top: 0.12rem;
  81. width: 100%;
  82. height: 0.94rem;
  83. background-color: #fff;
  84. }
  85. .city-list-hot li {
  86. width: 0.80rem;
  87. height: 0.30rem;
  88. float: left;
  89. margin-top: 0.1rem;
  90. margin-right: 0.15rem;
  91. margin-left: 0.15rem;
  92. font-size: 0.12rem;
  93. color: #222;
  94. text-align: center;
  95. line-height: 0.30rem;
  96. background-color: #f3f3f3;
  97. }
  98. .city-list {
  99. width: 100%;
  100. margin-top: 0.10rem;
  101. border-radius: 4px;
  102. margin-right: 0.30rem;
  103. background-color: #fff;
  104. }
  105. .city-list dl {
  106. padding-top: 0.14rem;
  107. margin-left: 0.18rem;
  108. padding-bottom: 0.14rem;
  109. border-bottom: 0.5px solid #d8d8d8;
  110. }
  111. .city-list dt {
  112. font-size: 0.16rem;
  113. font-weight: bold;
  114. color: #222;
  115. }
  116. .city-list dd {
  117. margin-top: 0.14rem;
  118. font-size: 0.14rem;
  119. color: #222;
  120. }
  121. .navbar {
  122. position: fixed;
  123. right: 0;
  124. top: 1.54rem;
  125. width: 0.20rem;
  126. /*height: 4.10rem;*/
  127. height: 70%;
  128. background-color: #fff;
  129. font-size: 0;
  130. overflow-y:auto ;
  131. }
  132. .navbar a {
  133. margin-top: 0.04rem;
  134. color: #5d7dff;
  135. font-size: 0.10rem;
  136. display: block;
  137. text-align: center;
  138. }
  139. .to-top {
  140. margin-top: 0.06rem;
  141. background-image: url(../img/hide.png);
  142. background-repeat: no-repeat;
  143. background-position: center;
  144. background-size: 50%;
  145. width: 0.20rem;
  146. height: 0.10rem;
  147. margin-bottom: 0.10rem;
  148. }
  149. .prompt {
  150. display: block;
  151. width: 0.40rem;
  152. height: 0.40rem;
  153. line-height: 0.40rem;
  154. font-size: 0.18rem;
  155. border-radius: 50%;
  156. background-color: rgba(0, 0, 0, 0.7);
  157. color: #fff;
  158. text-align: center;
  159. position: fixed;
  160. top: 50%;
  161. left: 50%;
  162. -webkit-transform: translate(-50%, -50%);
  163. transform: translate(-50%, -50%);
  164. }
  165. .alert-info {
  166. position: absolute;
  167. top: 1.74rem;
  168. right: 0.1rem;
  169. left: 0.1rem;
  170. font-size: 0;
  171. text-align: center;
  172. }
  173. .alert-info p {
  174. display: inline-block;
  175. height: 0.38rem;
  176. color: #fff;
  177. font-size: 0.14rem;
  178. line-height: 0.38rem;
  179. padding: 0 0.10rem;
  180. background-color: rgba(0, 0, 0, 0.7);
  181. border-radius: 5px;
  182. }