web应用开发:HTML5设计用户登录页面

代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户登录</title>
</head>
<body>
<form action="register.html" method="post">
    <table>
        <tr>
            <td>用户名</td>
            <td><input id="username" name="username" type="text"></td>
        </tr>
        <tr>
            <td>密码</td>
            <td><input id="password" username="password" type="password"></td>
        </tr>
        <tr>
            <td>确认密码</td>
            <td><input id="ConfirmPass" username="ConfPass" type="password"></td>
        </tr>
        <tr>
            <td>用户类型</td>
            <td><select id="userType" username="userType" >
                <option id="admin" name="admin" value="1">管理员</option>
                <option id="sysAdmin" name="sysAdmin" value="2">系统管理员</option>
                <option id="normoluser" name="normolauser" value="3">普通用户</option>
            </select> </td>
        </tr>
        <tr>
            <td>性别</td>
            <td><input type="radio" id="man" name="sex" vlaue="1"><input type="radio" id="woman" name="sex" vlaue="2"></td>
        </tr>
        <tr>
            <td>出生日期</td>
            <td><input id="birthday" name="birthday" type="date">
            </td>
        </tr>
        <tr>
            <td>兴趣爱好</td>
            <td><input type="CheckBox" id="read" name="interest" vlaue="1">阅读
                <input type="CheckBox" id="music" name="interest" vlaue="2">音乐
                <input type="CheckBox" id="sport" name="interest" vlaue="3">运动
            </td>
        </tr>
        <tr>
            <td>电子邮箱</td>
            <td><input type="email" id="email" name="email"></td>
        </tr>
        <tr>
            <td>自我介绍</td>
            <td><textarea name="instroduction" cols="40" rows="5"></textarea></td>
        </tr>
    </table>
    <input type="submit" id="login" value="提交">
    <input type="reset" id="loginReset" value="重置">
</form>
</body>
</html>

效果图
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/weixin_43916678/article/details/104480871