Html查漏补缺04-表单 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单</title>
</head>
<body>
<form method="post" action="index.html">
    <div>
        <label for="username">账号：</label>
        <input id="username" required pattern="^1[358]\d{9}" name="username" type="text"  maxlength="9" placeholder="请输入账号">
    </div>

    <div>
        密码：<input required name="password" type="password" maxlength="9" placeholder="9位密码">
    </div>

    <div>
        记住我<input name="remember" type="checkbox">
    </div>

    <div>
        <input type="reset" value="重置">
    </div>

    <div>
        <input type="submit" value="提交">
    </div>

    <div>
        <input type="image" src="cjf.png" style="width:100px">
    </div>

    <div>
        个人简介
    </div>
    <div>
        <textarea name="area" id="" cols="30" rows="10">填写简介</textarea>
    </div>

    <div>
        上传图片
    </div>
    <div>
        <input name="user_img" type="file">
    </div>

    <div>
        电子邮箱<input name="email" type="email">
    </div>

    <div>
        网站地址<input name="url" type="url">
    </div>

    <div>
        年龄<input name="age" type="number" min="0" max="99">
    </div>

    <div>
        滑块<input name="range1" type="range" min="0" max="100" step="20">
    </div>

    <div>
        搜索<input name="search_1" type="search">
    </div>
</form>
</body>
</html>

 

posted @ 2020-06-20 23:30  Tsui98'  阅读(125)  评论(0)    收藏  举报