表单补充

一、表单的作用：收集用户信息

    <form action="数据提交的路径" name="" method="数据提交方式"></form>

二、表单控件：

        <input type="text">  文本框

        <input type="password">  密码框

        <input type="submit">  提交按钮

        <input type="reset">  重置按钮

        <input type="button">  空按钮  

三、补充表单控件：

        1：单选按钮：

            <input type="radio">

            注：在单选按钮里面：每一组单选按钮  保持name属性值一致。

        2: 多选按钮（复选框）

            <input type="checkbox">

        3: 下拉菜单（下拉列表）

            <select>

                <option></option>

                <option></option>

                <option></option>

                ...

            </select>

        4: 多行文本域

            <textarea></textarea>

                cols 和 rows  以字符为单位

        注：阻止用户进行缩放  css属性  resize:none;

        5: 上传文件框

            <input type="file">

四、HTML5新增控件：

email　　　　　  限制用户必须输入email类型

url　　　　　　   限制用户必须输入URL类型

number　　　　  限制用户必须输入数字类型

range　　　　　 产生一个滑动条

color　　　　　  产生一个颜色选择框

search　　　　  产生一个搜索框

time 　　　　　 时间类型

month  　　　　月份

week   　　　　周

datetime-local   选取本地时间

date   　　　　 只有年月日

五、补充表单的html属性

        1：默认选中

            checked="checked"

        2: 表单控件的禁用

            disabled="disabled"

        3: 下拉列表里面的默认选中

            selected="selected"

六、HTML5新增属性：

min　　　　   最小

max　　　　  最大

required   　　如果表单没有输入内容的情况下，禁止提交

step    　　      确定一个法定值eg : 3      -6 -3 0 3 6 9

autocomplete  自动提示信息  属性值 on/off

placeholder     文本框的提示信息

autofocus        自动聚焦

pattern            属性值是一个 正则表达式(高效的字符串处理规则)

novalidate       取消验证

multiple           选择（上传）多个 \  输入框里面把逗号分隔的当作两个提交的信息

list属性           必须和datalist 标签结合使用,绑定的datalist的id名称

七、表单里面的标签：

       1： fieldset（表单字段集）

            ①作用：给表单做分组

            ②特点：

                默认情况下自带边框

                可以进行互相嵌套

        l2：legend （字段集标题）

           ① 作用：是fieldset 一组里面的一个标题

           ②特点：一般情况下，放在fieldset第一个子元素位置。

           ③ <label for=""></label>

           ④说明：

                label里面放的是提示信息

                for属性：绑定对应控件的id名称

八、HTML5表单里面新增标签：

①<datalist>     　　　　　　做提示信息的   必须和list属性结合使用

       <option value="">          可以追加一个label属性

</datalist>  

②<output for="关联的是要做运算的元素的id名称"><output>   做输出的(计算结果的输出)