style.css 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231
  1. html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  2. margin: 0;
  3. padding: 0;
  4. border: 0;
  5. outline: 0;
  6. font-size: 100%;
  7. vertical-align: baseline;
  8. background: transparent;
  9. /*outline-style: none*/
  10. }
  11. @keyframes fade-in {
  12. 0% {
  13. opacity: 0;
  14. }
  15. /*初始状态 透明度为0*/
  16. 40% {
  17. opacity: 0;
  18. }
  19. /*过渡状态 透明度为0*/
  20. 100% {
  21. opacity: 1;
  22. }
  23. /*结束状态 透明度为1*/
  24. }
  25. @-webkit-keyframes fade-in {
  26. /*针对webkit内核*/
  27. 0% {
  28. opacity: 0;
  29. }
  30. 40% {
  31. opacity: 0;
  32. }
  33. 100% {
  34. opacity: 1;
  35. }
  36. }
  37. #wrapper {
  38. }
  39. body {
  40. /*line-height: 1;*/
  41. font: 14px/1.5 "Segoe UI", "Lucida Grande", Helvetica, Arial, "Microsoft YaHei", FreeSans, Arimo, "Droid Sans", "wenquanyi micro hei", "Hiragino Sans GB", "Hiragino Sans GB W3", Roboto, Arial, sans-serif;
  42. }
  43. a {
  44. margin: 0;
  45. padding: 0;
  46. border: 0;
  47. font-size: 100%;
  48. vertical-align: baseline;
  49. background: transparent
  50. }
  51. a:hover, a:focus {
  52. text-decoration: none;
  53. bblr: expression(this.onFocus=this.blur());
  54. outline-style: none
  55. }
  56. table {
  57. border-collapse: collapse;
  58. border-spacing: 0
  59. }
  60. input, select {
  61. vertical-align: middle
  62. }
  63. * {
  64. -webkit-box-sizing: border-box;
  65. -moz-box-sizing: border-box;
  66. box-sizing: border-box;
  67. }
  68. .clearfix::before, .clearfix::after {
  69. content: "";
  70. height: 0;
  71. line-height: 0;
  72. display: block;
  73. visibility: hidden;
  74. clear: both
  75. }
  76. .clearfix:after {
  77. clear: both
  78. }
  79. .clearfix {
  80. *zoom: 1
  81. }
  82. /* login */
  83. html, body {
  84. height: 100%;
  85. }
  86. .page-login-v3:before {
  87. position: fixed;
  88. top: 0;
  89. left: 0;
  90. z-index: -1;
  91. width: 100%;
  92. height: 100%;
  93. content: '';
  94. background: #62a8ea;
  95. background: url(../../img/login_bg.jpg) center center/cover no-repeat !important;
  96. }
  97. .container {
  98. text-align: center;
  99. height: 100%;
  100. }
  101. .container:before {
  102. display: inline-block;
  103. height: 100%;
  104. vertical-align: middle;
  105. content: "";
  106. }
  107. .login-body {
  108. display: inline-block;
  109. vertical-align: middle;
  110. width: 400px;
  111. margin: 75px 0;
  112. background: #fff;
  113. border-radius: 4px;
  114. padding: 50px 40px 40px;
  115. -webkit-box-sizing: border-box;
  116. -moz-box-sizing: border-box;
  117. box-sizing: border-box;
  118. box-shadow: rgba(199, 199, 199, 0.18) 0 0 70px 8px;
  119. animation: fade-in; /*动画名称*/
  120. animation-duration: .6s; /*动画持续时间*/
  121. -webkit-animation: fade-in .6s; /*针对webkit内核*/
  122. }
  123. .login-content {
  124. }
  125. .login-content .brand .brand-img {
  126. width: 50px;
  127. }
  128. .login-content .brand .brand-text {
  129. margin-top: 20px;
  130. margin-bottom: 11px;
  131. font-size: 20px !important;
  132. /*font-family: "Microsoft YaHei";*/
  133. text-shadow: rgba(0, 0, 0, .15) 0 0 1px;
  134. font-weight: 400;
  135. color: #2e73ff;
  136. }
  137. .login-form {
  138. margin: 45px 0 30px;
  139. }
  140. .login-form .form-group {
  141. margin: 30px 0;
  142. }
  143. .login-form input {
  144. display: block;
  145. border: 0;
  146. border-radius: 0;
  147. -webkit-box-shadow: none;
  148. box-shadow: none;
  149. width: 100%;
  150. border-bottom: 1px solid #E4EAEC;
  151. /*font-size: 14px;*/
  152. height: 42px;
  153. /*line-height: 1.5;*/
  154. outline: none;
  155. padding: 0 5px;
  156. color: #a3afb7;
  157. font: 14px/1.5 "Segoe UI", "Lucida Grande", Helvetica, Arial, "Microsoft YaHei", FreeSans, Arimo, "Droid Sans", "wenquanyi micro hei", "Hiragino Sans GB", "Hiragino Sans GB W3", Roboto, Arial, sans-serif;
  158. transition: all 0.3s ease-in-out;
  159. -moz-transition: all 0.3s ease-in-out;
  160. -webkit-transition: all 0.3s ease-in-out;
  161. -o-transition: all 0.3s ease-in-out;
  162. }
  163. .login-form input:focus {
  164. border-bottom: 1px solid #2e73ff;
  165. }
  166. .login-form button {
  167. width: 100%;
  168. margin-top: 20px;
  169. padding: 10px 18px;
  170. font-size: 18px;
  171. line-height: 1.3333333;
  172. border-radius: 30px;
  173. white-space: normal;
  174. -webkit-transition: border .2s linear, color .2s linear, width .2s linear, background-color .2s linear;
  175. -o-transition: border .2s linear, color .2s linear, width .2s linear, background-color .2s linear;
  176. transition: border .2s linear, color .2s linear, width .2s linear, background-color .2s linear;
  177. -webkit-font-smoothing: subpixel-antialiased;
  178. color: #fff;
  179. background-color: #2e73ff;
  180. /*border-color: #2e73ff;*/
  181. /*background-image: none;*/
  182. border: 1px solid transparent;
  183. cursor: pointer;
  184. outline: none;
  185. box-shadow: rgba(152, 22, 244, 0.19) 0px 5px 10px 2px;
  186. }
  187. .login-form button[disabled], .login-form button[disabled]:hover {
  188. color: #fff;
  189. background-color: #a2caee;
  190. border-color: #a2caee;
  191. cursor: not-allowed;
  192. opacity: .65;
  193. }
  194. .login-form button:hover {
  195. background-color: #558dff;
  196. border-color: #558dff;
  197. }