HTML表单部分学习笔记

第一部分：

    <!--
        action ：指定处理提交表单的格式
        method ：指定提交表单的http方法
        enctype：指明用来把表单提交给服务器时的互联网媒体形式
    -->
    <form action="url" method="get|post" enctype="mine">
    <!--
        表单是一个包含表单元素的区域，通过添加不同的表单元素，将显式不同的效果
    -->
        <br><input type="text" name="user">
        <br><input type="password" name="password">
        <br><input type="submit" name="login">
    </form>

单行文本输入框：

    <form>
        <!--
            type="text"    ：定义单行文本输入框
            name        ：定义文本框的名字，要保证数据的准确采集，必须定义独一无二的名称。
            size        ：定义文本框的宽度，单位是当个字符的宽度
            maxlength    ：定义最多能够输入的字符数
            value        ：定义文本框的初始值
        -->
        <input type="text" name="yourname" size="20" maxlength="15">
    </form>

多行文本输入框：

    <form>
        <!--
            name：定义多行文本框的名字，要保证数据的准确采集，必须定义独一无二的名称。
            cols：定义多行文本框的宽度，单位是单个字符的宽度
            rows：定义多行文本框的高度，单位是单个字符的高度
            wrap：定义输入内容导入文本域时的显示方式
        -->
        <textarea name="yourworks" cols="50" rows="5" wrap=""></textarea>
    </form>

input标签的整理：

    <form>
        <!--
            input标签的type属性：
                text：单行文本输入框
                password：密码域
                radio：单选按钮
                checkbox：复选框按钮
                button：普通按钮
                submit：提交按钮
                reset：重置按钮
        -->
        <!--
            url:用于说明网站强制，显示为在一个文本框中输入url地址，提交时表单会自动验证url的值
            email：用于让浏览者输入email地址，提交时表单会自动验证email域的值
        -->
        <input type="url">
        <input type="email">
        <!--
            HTML5新增了一些日期和时间输入类型，其中包括
                date ：选取日月年
                month：选取日年
                week ：选取周年
                time ：选取时间
                datetime：选取时间日月年
                datetime-local：选取时间日月年，本地时间
        -->
        <input type="date"><br>
        <input type="month"><br>
        <input type="week"><br>
        <input type="time"><br>
        <input type="datetime"><br>
        <input type="datetime-local"><br>

        <!--
            range：可以显示一个滚动的空间，可用max，min和step设置控件的范围
            number：提供一个输入数字的输入类型，用户可以直接输入数字或者通过单价微调框中的按钮选择数字
            为空）
        -->
        <input type="range" name="fir" max="10" min="1" step="1"><br>
        <input type="number" name="sec" max="10" min="1" step="2"><br>

        <!--
            required属性：规定必须在提交之间填写输入域（不能为空）。required属性适用于text，search，url，email，password，date，pickers，number，checkbox，radio等
        -->
        <input type="text" name="user" required="required"><br>
        <input type="password" name="pwd" required="required"><br>
    </form>

多行选择列表：

    <form>
        <!--
            选择列表标记
                size：定义选择列表的行数
                multiple：表示可以多选（按住ctrl键多选）
                value：定义选择项的值
                selected：便是默认已经选择本项
        -->
        <select name="fruit" size="3" multiple>
            <option value="A">A
            <option value="B">B
            <option value="C">C
            <option value="D">D
        </select>
    </form>