| | |
|---|
| | | width: 20%; |
|---|
| | | height: 90%; |
|---|
| | | /*特效*/ |
|---|
| | | background: rgba(255,255,255,0.5); |
|---|
| | | background: rgba(255,255,255,0.7); |
|---|
| | | border-radius: 5px; |
|---|
| | | color: #ffffff; |
|---|
| | | z-index: 99; |
|---|
| | | box-shadow: 3px 3px 6px 3px rgba(0, 0, 0, .3); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .login-contain { |
|---|
| | | position: relative; |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | .login-box { |
|---|
| | | position: absolute; |
|---|
| | | top: 50%; |
|---|
| | | left: 50%; |
|---|
| | | transform: translate(-50%, -50%); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .login-input { |
|---|
| | | background:none; |
|---|
| | | outline:none; |
|---|
| | | padding: 2px 5px; |
|---|
| | | border: 1px solid #ffffff; |
|---|
| | | border-radius: 15px; |
|---|
| | | } |
|---|
| | | .login-input:focus{ |
|---|
| | | /*border:none;*/ |
|---|
| | | } |
|---|
| | | |
|---|
| | | </style> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | <!-- 侧边栏 --> |
|---|
| | | <div id="sidebar"> |
|---|
| | | <div class="login-contain"> |
|---|
| | | <div class="login-box"> |
|---|
| | | <div class="login-item"> |
|---|
| | | <div class="login-label"></div> |
|---|
| | | <input type="text" class="login-input"> |
|---|
| | | </div> |
|---|
| | | <div class="login-item"> |
|---|
| | | <div class="login-label"></div> |
|---|
| | | <input type="text" class="login-input"> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | <script src="js/main.min.js"></script> |
|---|
| | | <script> |
|---|
