zoukankan      html  css  js  c++  java
  • 登陆界面设置

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>登录页面</title>
        <style>
            body,h2,div{
                margin: 0;
                padding: 0;
            }
            #main{
                 400px;
                height: 250px;
                border: 1px solid rgb(185,192,204);
                border-radius: 5px;
                box-shadow: 3px 3px 3px #888;
                position: absolute;
                left: 50%;
                top: 50%;
                margin-left: -200px;
                margin-top: -200px;
                /*position: relative;*/
            }
            #in{
                 100%;
                 height: 160px;
                 /*background: #fff;*/

                 /*line-height: 1.5;*/
                 padding-left: 40px;
            }
            #in input{
                line-height: 2;
                margin-top: 25px;
                 200px;
                border:1px solid  #C2C2C2;
                border-radius: 3px;
            }
            #in input[type=text]{
                background: url(imgs/user1.png) no-repeat 0 center;
                -webkit-background-size: 20px 20px;
                background-size: 20px 20px;
                padding-left: 22px;
            }
            #in input[type=password]{
                background: url(imgs/lock2.png) no-repeat 0 center;
                -webkit-background-size: 20px 20px;
                background-size: 20px 20px;
                padding-left: 22px;
            }
            label{
                color: #585858;
            }
            #btn{
                 100%;
                height: 45px;
                line-height: 45px;
                background: rgb(68,68,68);
                text-align: center;

            }
            h2{
                font-size: 25px;
                background: rgb(68,68,68);
                color:#fff;
                text-indent: 15px;
                height: 45x;
                line-height: 45px;
            }
            
        </style>
    </head>
    <body>
        <div id="main">
            <h2>LOGIN</h2>
            <form action="action/loginAction.php" method="post">
                <div id="in">
                    <label for="username">用户名:<input type="text" name="username" id="username" placeholder="输入用户名"></label><br>
                    <label for="userpass">密&nbsp;&nbsp;&nbsp;&nbsp;码:<input type="password" name="userpass" id="userpass" placeholder="输入用户密码"></label><br>
                </div>
                <div id="btn">
                   <input type="submit" value="登 录">
                </div>
            </form>
        </div>
    </body>
    </html>

  • 相关阅读:
    编辑器1.0
    react native定报预披项目知识点总结
    placeholder中文字添加换行方法
    ios端position为fixed失效的解决办法
    利用fis3构建前端项目工程
    webpack学习记录
    webpack学习记录-认识loader(二)
    webpack学习记录-初步体验(一)
    去抖(节流)
    css布局:左边定宽、右边自适应
  • 原文地址:https://www.cnblogs.com/zteng/p/6774676.html
Copyright © 2011-2022 走看看