登录 login

Andy
1 parent ee75cbd3
Showing 5 changed files with 154 additions and 4 deletions
css/login.css
image/login_pwsicon.png
image/login_usericon.png
image/login_vericon.png
login.html
@@ -20,6 +20,9 @@ html,body{
     color: #fff;
     font-size: 32px;
 }
+.float-left{
+    float: left;
+}
 .login-content{
     height: 412px;
     width: 580px;
@@ -46,6 +49,118 @@ html,body{
     margin-left: -50px;
     background-image: url("../image/logo-loginGreen.png");
     background-repeat: no-repeat;
-    background-position: 22px 12px;
+    background-position: 21px 24.5px;
     background-size: 58px 51px;
+}
+.user-cont{
+    margin: 0 auto;
+    padding-top: 95px;
+    width: 332px;
+    height: 136px;
+    /*border: 1px solid #ddd;*/
+}
+.psw-cont{
+    margin: 0 auto;
+    width: 332px;
+    height: 40px;
+    margin-top: 24px;
+    margin-bottom: 24px;
+}
+.cont-user,.cont-psw{
+    height: 42px;
+    line-height: 40px;
+    width: 332px;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+}
+.user-bg{
+    height: 40px;
+    width: 40px;
+    background-color: #ddd;
+    background-image: url("../image/login_usericon.png");
+    background-size: 19px 17px;
+    background-repeat: no-repeat;
+    background-position: 10px 11.5px;
+    float: left;
+}
+.psw-bg{
+    height: 40px;
+    width: 40px;
+    background-color: #ddd;
+    background-image: url("../image/login_pwsicon.png");
+    background-size: 16px 20px;
+    background-repeat: no-repeat;
+    background-position: 12px 10px;
+    float: left;
+}
+.login-control{
+    height: 40px;
+    line-height: 40px;
+    width: 290px;
+    outline: none;
+    border: none !important;
+    border-top-right-radius:4px;
+    border-bottom-right-radius:4px;
+    padding-left: 12px;
+}
+.ver-cont{
+    width: 222px;
+    height: 42px;
+    margin-left: 124px;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    margin-bottom: 10px;
+}
+.ver-bg{
+    height: 40px;
+    width: 40px;
+    background-color: #ddd;
+    background-image: url("../image/login_vericon.png");
+    background-size: 16px 16px;
+    background-repeat: no-repeat;
+    background-position: 12px 12px;
+    float: left;
+}
+.ver-control{
+    height: 40px;
+    line-height: 40px;
+    width: 180px;
+    outline: none;
+    border: none !important;
+    border-top-right-radius:4px;
+    border-bottom-right-radius:4px;
+    padding-left: 12px;
+}
+.imgWrap{
+    height: 42px;
+    width: 98px;
+    background: #ddd;
+    border-radius: 4px;
+    margin-left: 10px;
+}
+.imgWrap img {
+    width: 100%;
+    height: 100%;
+}
+.error_info{
+    height: 30px;
+    line-height: 30px;
+    font-size: 14px;
+    color: #f00;
+    text-align: center;
+    margin-bottom: 8px;
+}
+.login-foot{
+    width: 100%;
+    height: 40px;
+}
+.login-foot .btn{
+    height: 40px;
+    width: 148px;
+    background: #26be96;
+    border-radius: 20px;
+    color: #fff;
+    font-size:18px;
+    margin: 0 auto;
+    display: block;
 }
 \ No newline at end of file
@@ -6,6 +6,10 @@
     <meta name="renderer" content="ie-comp">
     <meta name="renderer" content="ie-stand">
     <meta name="google" content="notranslate" />
+    <meta http-equiv="pragma" content="no-cache">
+    <meta http-equiv="cache-control" content="no-cache">
+    <meta http-equiv="expires" content="0">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
     <title>登录</title>
     <link rel="stylesheet" href="css/libCss/common.css">
     <link rel="stylesheet" href="css/libCss/bootstrap.min.css">
@@ -15,16 +19,47 @@
 <body>
 <div class="login-model">
 <!-- top-tit -->
-    <div class="top-tit">欢迎登陆企业云接口平台</div>
+    <div class="top-tit">欢迎登录企业云接口平台</div>
 <!-- content sta-->
-    <div class="login-content boxshadow posrel">
+    <div class="login-content boxshadow posrel clearfix">
         <div class="login-contop posabl"></div>
+        <!-- user -->
+        <div class="user-cont">
+            <div class="cont-user clearfix">
+                <span class="user-bg"></span>
+                <input class="login-control" type="text" autocomplete="off" placeholder="请输入用户名" name="username" id="userName" maxlength="25">
+            </div>
+        </div>
+        <!-- psw -->
+        <div class="psw-cont">
+            <div class="cont-psw clearfix">
+                <span class="psw-bg"></span>
+                <input class="login-control" type="text" autocomplete="off" placeholder="请输入6-20位字母和数字组成的密码" name="password" id="passWord" maxlength="25">
+            </div>
+        </div>
+        <!-- yanzhengma -->
+        <div class="clearfix">
+            <div class="ver-cont posrel float-left">
+                <i class="verification-logo"></i>
+                <span class="ver-bg float-left"></span>
+                <input class="ver-control verification-input float-left" type="text" autocomplete="off" placeholder="请输入验证码" name="" maxlength="4" id="login_imgCode_value">
+            </div>
+            <span class="imgWrap float-left">
+                    <!--<img src="" id="login_imgCode">-->
+            </span>
+        </div>
+        <!--error -->
+        <div class="error_info">密码错误</div>
+        <!--btn login-->
+        <div class="login-foot">
+            <button type="button" class="btn uppercase" id="login-btn">登录</button>
+        </div>
     </div>
 </div>
 <script type="text/javascript" src="js/libJs/jquery.min.js"></script>
 <script type="text/javascript" src="js/libJs/bootstrap.min.js"></script>
 <script type="text/javascript">
-    document.write("<s" + "cript type='text/javascript' src='../assets/pages/scripts/login.js?ver" + Math.random() + "'></s" + "cript>");
+    document.write("<s" + "cript type='text/javascript' src='js/login.js?ver" + Math.random() + "'></s" + "cript>");
 </script>
 </body>
 </html>
 \ No newline at end of file