其他分享
首页 > 其他分享> > 登录界面

登录界面

作者:互联网

<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            html{   
                width: 100%;   
                height: 100%;   
                overflow: hidden;   
                font-style: sans-serif;   
            }   
            body{
                width: 100%;   
                height: 100%;   
                font-family: 'Open Sans',sans-serif;   
                margin: 0;   
                background-color: #4A374A;   
            }   
            #login{   
                position: absolute;   
                top: 50%;   
                left:50%;   
                margin: -150px 0 0 -150px;   
                width: 300px;   
                height: 300px;   
            }   
            #login h1{   
                color: #fff;   
                text-shadow:0 0 10px;   
                letter-spacing: 1px;   
                text-align: center;   
            }   
            h1{   
                font-size: 2em;   
                margin: 0.67em 0;   
            }   
            input{   
                width: 278px;   
                height: 18px;   
                margin-bottom: 10px;   
                outline: none;   
                padding: 10px;   
                font-size: 13px;   
                color: #fff;   
                text-shadow:1px 1px 1px;   
                border-top: 1px solid #312E3D;   
                border-left: 1px solid #312E3D;   
                border-right: 1px solid #312E3D;   
                border-bottom: 1px solid #56536A;   
                border-radius: 4px;   
                background-color: #2D2D3F;   
            }   
            .but{   
                width: 300px;   
                min-height: 20px;
                display: block;   
                background-color: #4a77d4;   
                border: 1px solid #3762bc;   
                color: #fff;   
                padding: 9px 14px;   
                font-size: 15px;   
                line-height: normal;   
                border-radius: 5px;   
                margin: 0;   
            }  
        </style>
    </head>
    
    <body>
        <div id="login">
            <h1>Login</h1>
            <form method="post">
                <input type="text" name="username" id="username" value="" required="required" placeholder="用户名" />
                <br/>
                <input type="text" name="password" id="password" value="" required="required" placeholder="密码"/>
                <br/>
                <button class="but" type="submit">登录</button>
            </form>
        </div>
        
        
    </body>
</html>

 

标签:界面,登录,color,height,width,1px,font,border
来源: https://www.cnblogs.com/dhl-kzh/p/15982350.html