city-picker.css 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  1. /* 2016-10-30 17:08:13 | 修改 木遥(微信: http://marsgis.cn/weixin.html ) */
  2. .city-picker-input {
  3. opacity: 0 !important;
  4. top: -9999px;
  5. left: -9999px;
  6. position: absolute;
  7. }
  8. .city-picker-span {
  9. position: relative;
  10. display: block;
  11. outline: 0;
  12. -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  13. border-bottom: 1px solid #ccc;
  14. background-color:transparent!important;
  15. color: #ccc;
  16. cursor: pointer;
  17. }
  18. .city-picker-span > .placeholder {
  19. color: #aaa;
  20. }
  21. .city-picker-span > .arrow {
  22. position: absolute;
  23. top: 50%;
  24. right: 8px;
  25. width: 10px;
  26. margin-top: -3px;
  27. height: 5px;
  28. /*background: url(../images/drop-arrow.png) -10px -25px no-repeat;*/
  29. }
  30. .city-picker-span.focus,
  31. .city-picker-span.open {
  32. border-bottom-color: #46A4FF;
  33. }
  34. .city-picker-span.open > .arrow {
  35. background-position: -10px -10px;
  36. }
  37. .city-picker-span > .title > span {
  38. color: #fff;
  39. padding: 5px;
  40. border-radius: 3px;
  41. }
  42. .city-picker-span > .title > span:hover {
  43. background-color: rgba(63, 72, 84, 0.9);
  44. }
  45. .city-picker-dropdown {
  46. position: absolute;
  47. width: 225px;
  48. left: -9999px;
  49. top: -9999px;
  50. outline: 0;
  51. -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  52. z-index: 999999;
  53. display: none;
  54. min-width: 240px;
  55. margin-bottom: 20px;
  56. }
  57. .city-select-wrap {
  58. /*box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);*/
  59. }
  60. .city-select-tab {
  61. border-bottom: 1px solid #ccc;
  62. background: #f0f0f0;
  63. font-size: 13px;
  64. }
  65. .dark .city-select-tab {
  66. background: #087698;
  67. }
  68. .city-select-tab > a {
  69. display: inline-block;
  70. padding: 8px 22px;
  71. border-left: 1px solid #ccc;
  72. border-bottom: 1px solid transparent;
  73. color: #4D4D4D;
  74. text-align: center;
  75. outline: 0;
  76. text-decoration: none;
  77. cursor: pointer;
  78. font-size: 13px;
  79. margin-bottom: -1px;
  80. }
  81. .city-select-tab > a.active {
  82. background-color:transparent!important;
  83. border-bottom: 1px solid #fff;
  84. color: #46A4FF;
  85. }
  86. .city-select-tab > a:first-child {
  87. border-left: none;
  88. }
  89. .city-select-tab > a:last-child.active {
  90. border-right: 1px solid #ccc;
  91. }
  92. .city-select-content {
  93. width: 100%;
  94. min-height: 10px;
  95. background: rgba(63, 72, 84, 0.9);
  96. padding: 5px 5px;
  97. box-sizing: border-box;
  98. }
  99. .city-select {
  100. font-size: 13px;
  101. }
  102. .city-select dl {
  103. line-height: 2;
  104. clear: both;
  105. padding: 3px 0;
  106. margin: 0;
  107. }
  108. .city-select dt {
  109. position: absolute;
  110. width: 2.5em;
  111. font-weight: 500;
  112. text-align: right;
  113. line-height: 2;
  114. }
  115. .city-select dd {
  116. margin-left: 0;
  117. line-height: 2;
  118. }
  119. .city-select.province dd {
  120. margin-left: 3em;
  121. }
  122. .city-select a {
  123. display: inline-block;
  124. padding: 0 10px;
  125. outline: 0;
  126. text-decoration: none;
  127. white-space: nowrap;
  128. margin-right: 2px;
  129. text-decoration: none;
  130. color: #fff;
  131. cursor: pointer;
  132. }
  133. .city-select a:hover,
  134. .city-select a:focus {
  135. background-color: rgba(63, 72, 84, 0.9);
  136. border-radius: 2px;
  137. color: #46A4FF;
  138. }
  139. .city-select a.active {
  140. background-color: #46A4FF;
  141. color: #fff;
  142. border-radius: 2px;
  143. }