无意间看到一套不错的网站登陆后台界面,特整理了一下给大家分享分享;
效果代码如下所示:
<!DOCTYPE html> <html lang="en" class="no-js"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>CMS系统</title> <link rel="stylesheet" type="text/css" href="/images/normalize.css"> <link rel="stylesheet" type="text/css" href="/images/demo.css"> <!--必要样式--> <link rel="stylesheet" type="text/css" href="/images/component.css"> </head> <body onload="document.login.username.focus();" style="overflow:-Scroll;overflow-y:hidden"> <div class="container demo-1"> <div class="content"> <div id="large-header" class="large-header" style="height: 722px;"> <canvas id="demo-canvas" width="1536" height="722"></canvas> <div class="logo_box"> <h3>欢迎你</h3> <form name="login" id="login" method="post" action="" onsubmit="return CheckLogin(document.login);"> <input type="hidden" name="enews" value="login"> <div class="input_outer"> <span class="u_user"></span> <input name="username" class="text" style="color: #FFFFFF !important" type="text" placeholder="请输入账户"> </div> <div class="input_outer"> <span class="us_uer"></span> <input name="password" class="text" style="color: #FFFFFF !important; position:absolute; z-index:100;" value="" type="password" placeholder="请输入密码"> </div> <div class="mb2"><a class="act-but submit" href="javascript:document:login.submit();" style="color: #FFFFFF">登录</a></div> <input name="empirecmskey1" type="hidden" id="empirecmskey1" value=""> <input name="empirecmskey2" type="hidden" id="empirecmskey2" value=""> <input name="empirecmskey3" type="hidden" id="empirecmskey3" value=""> <input name="empirecmskey4" type="hidden" id="empirecmskey4" value=""> <input name="empirecmskey5" type="hidden" id="empirecmskey5" value=""> </form> </div> </div> </div> </div><!-- /container --> <script src="/images/TweenLite.min.js"></script> <script src="/images/EasePack.min.js"></script> <script src="/images/rAF.js"></script> <script src="/images/demo-1.js"></script> </body></html>