html用户注册页面_纯html 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户注册</title>
</head>
<body>
    <!--头部-->
    <div style="height: 100px;width: 100%">
        <div style="height: 100px;width: 10%;float:left">
            <img src="oldboy.jpg" style="width: 100px;height: 100px">
        </div>
        <div style="height: 100px;width: 30%;float:left;font-size:30px">
            <p>欢迎注册<br>老男孩</p>
        </div>
        <div style="height: 100px;width: 20%;float:right;font-size:30px">
            <p>已有账号
                <a href="http://www.baidu.com">请登陆</a></p>
        </div>
    </div>
    <!--注册表单-->
    <div style="height: 400px;width: 100%">
        <form>
            <p>用户名：<input type="text" value="您的账户名或登陆名"></p>
            <p>密码：<input type="text" value="建议至少两种字符组合"></p>
            <p>确认密码：<input type="text" value="请再次输入密码"></p>
            <p>省份：
                <select>
                    <option>北京</option>
                    <option>上海</option>
                    <option>广州</option>
                </select>
            </p>
            <p>性别：<br>
                <label for="m">男：</label><input id="m" type="radio" name="sex" value="male">
                <label for="f">女：</label><input type="radio" id="f" name="sex" value="fmale">
            </p>
            <p>爱好：<br>
                <label for="v">电影：</label><input id="v" type="checkbox" value="movie">
                <label for="b">看书：</label><input id="b" type="checkbox" value="book">
                <label for="g">游戏：</label><input id="g" type="checkbox" value="game">
            </p>
        </form>
        <!--提交-->
        <p><input type="checkbox" checked="checked">我已阅读并同意了协议</p>
        <input type="submit" value="立即注册" style="background-color: red;width: 400px;height: 50px;font-size:25px;color:white">
    </div>
    <!--结尾-->
    <div style="height: 100px;width: 100%">

    </div>
</body>
</html>
View Code

效果图：

posted on 2016-11-30 18:30  孔扎根  阅读(285)  评论(0)    收藏  举报

导航