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.

225 lines
3.7 KiB

4 weeks ago
  1. body{
  2. background-color: #F1F1F1;
  3. }
  4. *, :after, :before {
  5. box-sizing: border-box;
  6. }
  7. /*选择器*/
  8. .sign-up-msg{
  9. text-align: center;
  10. font-size: 12px;
  11. line-height: 20px;
  12. color: #969696;
  13. }
  14. /*标签选择器*/
  15. a{
  16. text-decoration: none;
  17. }
  18. /*后代选择器*/
  19. .sign-up-msg a{
  20. color: #3194d0;
  21. }
  22. .sign-up-msg a:hover{
  23. text-decoration: underline;
  24. }
  25. .sign {
  26. height: 100%;
  27. min-height: 750px;
  28. text-align: center;
  29. font-size: 14px;
  30. background-color: #f1f1f1;
  31. }
  32. /*表单样式*/
  33. .sign .main{
  34. background-color: #FFFFFF;
  35. width: 400px;
  36. padding: 50px;
  37. margin: 60px auto 0 auto;
  38. box-shadow: 0 0 8px rgba(0,0,0,0.1);
  39. border-radius: 5px;
  40. }
  41. .sign .logo{
  42. position: absolute;
  43. top: 56px;
  44. left: 50px;
  45. }
  46. /*登录注册文字*/
  47. .sign .title{
  48. margin: 0 auto 50px;
  49. padding: 10px;
  50. text-align: center;
  51. }
  52. .sign .title a{
  53. padding: 10px;
  54. color: #969696;
  55. font-size: 18px;
  56. }
  57. .sign .title a:hover{
  58. border-bottom: 2px solid #3BB149;
  59. }
  60. .sign .title .active{
  61. font-weight: 700;
  62. color: #3BB149;
  63. border-bottom: 2px solid #3BB149;
  64. }
  65. .sign .title span{
  66. padding: 10px;
  67. color: #969696;
  68. font-weight: 700;
  69. }
  70. /*表单文本框
  71. .sign form .input input{
  72. width: 100%;
  73. height: 50px;
  74. padding: 4px 12px 4px 35px;
  75. border: 1px solid #c8c8c8;
  76. background-color: #F8F8F8;
  77. box-sizing: border-box;
  78. }*/
  79. .sign form .restyle {
  80. margin-bottom: 0;
  81. }
  82. .sign form .input-prepend {
  83. position: relative;
  84. width: 100%;
  85. }
  86. .sign form .input-prepend input {
  87. width: 100%;
  88. height: 50px;
  89. margin-bottom: 0;
  90. padding: 4px 12px 4px 35px;
  91. border: 1px solid #c8c8c8;
  92. border-radius: 0 0 4px 4px;
  93. background-color: hsla(0,0%,71%,.1);
  94. vertical-align: middle;
  95. }
  96. .sign form .restyle input {
  97. border-bottom: none;
  98. border-radius: 4px 4px 0 0;
  99. }
  100. .sign form .no-radius input {
  101. border-radius: 0;
  102. }
  103. .sign form .input-prepend i {
  104. position: absolute;
  105. top: 14px;
  106. left: 10px;
  107. font-size: 18px;
  108. color: #969696;
  109. }
  110. .sign .sign-up-button{
  111. margin-top: 20px;
  112. width: 100%;
  113. padding: 9px 18px;
  114. font-size: 18px;
  115. border: none;
  116. border-radius: 25px;
  117. color: #FFFFFF;
  118. background-color: #42c02c;
  119. cursor: pointer;
  120. }
  121. .sign .sign-up-button:hover{
  122. background-color: #3db922;
  123. }
  124. .sign .sign-in-button{
  125. margin-top: 20px;
  126. width: 100%;
  127. padding: 9px 18px;
  128. font-size: 18px;
  129. border: none;
  130. border-radius: 25px;
  131. color: #FFFFFF;
  132. background-color: #3194d0;
  133. cursor: pointer;
  134. }
  135. .sign .sign-in-button:hover{
  136. background-color: #187cb7;
  137. }
  138. .sign .more-sign {
  139. margin-top: 50px;
  140. }
  141. .sign .more-sign h6 {
  142. position: relative;
  143. margin: 0 0 10px;
  144. font-size: 12px;
  145. color: #b5b5b5;
  146. }
  147. .sign .more-sign h6:after, .sign .more-sign h6:before {
  148. content: "";
  149. border-top: 1px solid #b5b5b5;
  150. display: block;
  151. position: absolute;
  152. width: 60px;
  153. top: 5px;
  154. }
  155. .sign .more-sign h6:before {
  156. left: 30px;
  157. }
  158. .sign .more-sign h6:after {
  159. right: 30px;
  160. }
  161. .sign .more-sign h6:after, .sign .more-sign h6:before {
  162. content: "";
  163. border-top: 1px solid #b5b5b5;
  164. display: block;
  165. position: absolute;
  166. width: 60px;
  167. top: 5px;
  168. }
  169. .sign .more-sign ul {
  170. margin-bottom: 10px;
  171. list-style: none;
  172. padding-left: 0;
  173. }
  174. .sign .more-sign ul li {
  175. margin: 0 3px;
  176. display: inline-block;
  177. }
  178. .sign .more-sign ul a {
  179. width: 50px;
  180. height: 50px;
  181. line-height: 50px;
  182. display: block;
  183. }
  184. .sign .more-sign .icon-weixin {
  185. color: #00bb29;
  186. }
  187. .sign .more-sign .icon-qq {
  188. color: #498ad5;
  189. }
  190. .sign .more-sign ul i {
  191. font-size: 28px;
  192. }
  193. .ic-wechat:before {
  194. content: "\E604";
  195. }
  196. .ic-qq_connect:before {
  197. content: "\E603";
  198. }