欢迎来到Cecilia陈的博客

孤独,是人一生最好的修行。

[06--CSS] reset 重置表单

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
         <form action="" method="get" enctype="multipart/form-data">
            <div>
                <!--这里的文本框的描述信息“用户名”我们可以像下面这样写,也可以用<label>标签写-->
                <!-- <label>用户名</label> -->
                <!--value="123" 是文本框一开始就默认显示的值-->
                用户名:<input type="text" name="user" value="123">
            </div>
            <div>
                <!-- 表单的密码框是密文的,描述信息“密码”一样可以用label标签写-->
                密码:<input type="password" name="pwd">
            </div>
            <div>
                <!--radio单选框,有多个选项只能选择一个,name属性是代表我单选框的总字段名,
                    value的值是提交到后台的值,checked是默认选择的-->
                <input type="radio" name="sex" value="1" checked>男
                <input type="radio" name="sex" value="0">女
            </div>
            <div>
                <!--checkbox复选框,有多个选项,可以选择多个值,
                    value的作用都是一样的,checked也是同理-->
                <input type="checkbox" name="hobbies" value="1" checked> 唱歌
                <input type="checkbox" name="hobbies" value="2" checked> 跳舞
                <input type="checkbox" name="hobbies" value="3"> 做饭
            </div>

            <div>
                <!--submit 提交按钮,这个是根据form表单中的action和method的属性来提交的-->
                <input type="submit">
                <!--button 普通按钮 就是一个鼠标点上去会闪,但是不会提交-->
                <input type="button" value="登录">
            </div>

             <div>
                 <!--file上传文件的,如果选择这个属性的话,需要把form表单的enctype属性设置为"multipart/form-data"-->
                 <input type="file" name="上传文件">
             </div>

             <div>
                 <!--reset重置,在点击她的时候,form表单的需要用户填写的内容都会被清空掉-->
                 <input type="reset">
             </div>

    </form>
</body>
</html>
posted @ 2019-10-16 23:09  Cecilia陈  阅读(253)  评论(0编辑  收藏  举报