div+css登陆界面案例2

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <style type="text/css">

    body{

        margin: 0px;

            padding:0px;

            font-size:12px;

            background-color: #1873aa;

            text-align: center;

            overflow: hidden;

    }

    #pagetop{

        background-image: url(images/head.gif);

        width: 1432px;

        height: 113px;



    }

    #pagecenter h1{

        text-align: left;

        margin-left: 50px;

        margin-top: 50px;

    }

    #pagecenter p{

        text-align: left;

        margin-left: 50px;

        font-size: 15px;



    }

    #input div{

        font-size: 17px;



    }

    #input div input{

        margin-left: 30px;

        margin-top: 8px;

        width:230px;

        height: 18px;

    }

    #form{

        text-align: left;

        margin-left: 50px;

    }

    #btn input{

        width: 80px;

        height: 30px;

        cursor:pointer;

    }

    #btn input:hover{

        cursor:hand;

    }

    #btn1{

        text-align: center;

        margin-top: 20px;

        margin-left: 130px;

    }

    #btn2{

        margin-top: 20px;

        margin-left: 30px;

    }

    #input img{

        width: 30px;

        height:30px;



    }

    </style>

</head>

<body>

    <div id="container">

        <div id="pagetop">

        </div>

        <div id="pagecenter">

            <h1>注册须知:</h1>

            <p>1:在本站注册的会员,必须遵守《互联网电子公告服务管理规定》,不得在本站诽谤他人,侵犯他人隐私,侵犯他人知识产权,传播病<br />毒政治言论,商业机密等信息。</p>

            <p>2:在所有本站发表的文章,本站都具有最终编辑权,并且保留用于向第三方印刷或者发表的权利,如果您的资料不齐全,我们将有权不作任<br />何通知使用你在本站发表的作品</p><br />

        </div>

        

        <div id="form">

            <form>

                <div id="input">

                    <div>

                        登陆账号:

                        <input type="text" name="username" />

                    </div>

                    <div>

                        重复密码:

                        <input type="password" name="password">

                    </div>

                    <div>

                        确认密码:

                        <input type="password" name="password">

                    </div>

                    <div>

                        电子邮箱:

                        <input type="password" name="password">

                    </div>

                    <div>

                        您的昵称:

                        <input type="password" name="password">

                    </div>

                    <div>

                        图片认证:

                        <input type="password" name="password">

                        <img src="images/yanzheng.gif">

                    </div>

                </div>

                <div id="btn">

                    <input id= "btn1" type="submit" value="重置" />

                    <input id= "btn2" type="button" value="注册" />

                </div>

            </form>

        </div>

        

        

    </div>

    

</body>

</html>

 

你可能感兴趣的:(div+css)