login.css 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157
  1. *,html,body{
  2. padding: 0;
  3. margin: 0;
  4. width: 100%;
  5. height: 100%;
  6. }
  7. body{
  8. background-image: url("img/bg.jpg");
  9. background-repeat: no-repeat;
  10. background-size: 100% 100%;
  11. position: relative;
  12. font-family: 'Microsoft YaHei',arial,tahoma,sans-serif;
  13. }
  14. .login-center{
  15. position: relative;
  16. top: 42%;
  17. left: 50%;
  18. margin-top: -200px;
  19. margin-left: -200px;
  20. width: 360px;
  21. height:400px ;
  22. }
  23. .login{
  24. height: 400px;
  25. background-color: #fff;
  26. background-color: rgba(255,255,255,0.5);
  27. filter:Alpha(opacity=50);
  28. border-radius:5px;
  29. margin-top: 20px;
  30. position: relative;
  31. }
  32. .logo{
  33. position: relative;
  34. width: 100%;
  35. height: 50px;
  36. background-image: url("img/logo.png");
  37. background-repeat: no-repeat;
  38. background-position: center;
  39. background-size: 240px 48px;
  40. }
  41. .font-center{
  42. text-align: center;
  43. font-size: 25px;
  44. font-weight: bold;
  45. padding-top: 20px;
  46. height: 25px;
  47. }
  48. .username{
  49. position: relative;
  50. top: 30px;
  51. text-align: center;
  52. height: 54px;
  53. }
  54. .password{
  55. position: relative;
  56. top: 60px;
  57. text-align: center;
  58. height: 54px;
  59. }
  60. .unitId{
  61. position: relative;
  62. top: 90px;
  63. text-align: center;
  64. height: 54px;
  65. }
  66. input{
  67. border: none;
  68. height: 50px;
  69. width: 200px;
  70. border: 2px solid #000;
  71. border-radius: 8px;
  72. font-size: 25px;
  73. padding-left: 50px;
  74. line-height: 50px;
  75. }
  76. select{
  77. border: none;
  78. height: 50px;
  79. width: 250px;
  80. border: 2px solid #000;
  81. border-radius: 8px;
  82. font-size: 25px;
  83. padding-left: 50px;
  84. line-height: 50px;
  85. }
  86. input:focus{
  87. border-color: #66afe9;
  88. outline: 0;
  89. -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
  90. box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
  91. }
  92. .confirm{
  93. height: 50px;
  94. width: 100%;
  95. position: relative;
  96. opacity: 1;
  97. top:125px;
  98. text-align: center;
  99. }
  100. .confirm button{
  101. box-shadow: none;
  102. opacity: 2;
  103. width: 200px;
  104. font-size: 20px;
  105. line-height: 45px;
  106. background-color: #337ab7;
  107. color: #fff;
  108. border-radius: 6px;
  109. border:1px solid #2e6da4;
  110. cursor: pointer;
  111. user-select: none;
  112. -webkit-user-select: none;
  113. }
  114. .confirm button:focus{
  115. outline: thin dotted;
  116. outline: 5px auto -webkit-focus-ring-color;
  117. outline-offset: -2px;
  118. text-decoration: none;
  119. }
  120. .confirm button:active{
  121. background-image: none;
  122. outline: 0;
  123. box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
  124. -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
  125. }
  126. .confirm button:hover{
  127. color: #fff;
  128. background-color: #286090;
  129. border-color: #204d74;
  130. }
  131. .img{
  132. width: 30px;
  133. height: 30px;
  134. position: absolute;
  135. top: 13px;
  136. left: 67px;
  137. user-select: none;
  138. -webkit-user-select: none;
  139. }