表单标签

表单：在网页中主要负责数据采集功能，使用标签定义表单

表单项：不同类型的input元素、下拉列表、文本域等

form：定义表单

action：规定当提交表单时向何处发送表单数据，URL
method：规定用于发送表单数据的方式
- get：浏览器会将数据直接附在表单的action URL之后。大小有限制
- post: 浏览器会将数据放到http请求消息体中。大小无限制。

<body>
<!-- 面试
form:
    action: 指定表单数据提交的url
        * 表单项数据想要被提交，则必须指定其name属性
    method: 指定表单提交的方式
        1. get: 默认值
            * 请求参数会拼接在url后边
            * url的长度有限制 4kb
        2. post:
            * 请求参数会在http请求协议的请求体中
            * 请求参数大小无限制
-->
<form action="#" method="post">
    <input type="text" name="username">
    <input type="submit">
</form>
</body>

表单项标签

<input>: 表单项，通过type属性控制输入形式
<select>: 定义下拉列表，<option>定义列表项
<text>: 文本域

<body>
<form action="#" method="post">
    <input type="hidden" name="id" value="123">

    <label for="username">用户名：</label>
    <input type="text" name="username" id="username"><br> <!--设置id，然后label关联到该id，实现点击lable，选中文本框-->
    <label for="password">密码：</label>
    <input type="password" name="password" id="password"><br>
    <!--设置value，指定向表单中提交radio的数据。实现两个radio的互斥，设置两个radio的name相同-->
    <!--如果要提交，要执行name属性-->
    性别:
    <input type="radio" name="gender" value="1" id="male"> <label for="male">男</label>
    <input type="radio" name="gender" value="2" id="femal"> <label for="femal">女</label>
    <br>
    <input type="checkbox" name="hobby" value="1"> 旅游
    <input type="checkbox" name="hobby" value="2"> 电影
    <input type="checkbox" name="hobby" value="3"> 游戏
    <input type="checkbox" name="hobby" value="4"> 旅游
    <br>
    头像:
    <input type="file"><br>

    城市：
    <select name="city">
        <!--指定value后，提交的是beijing，而不是 北京-->
        <option value="beijing">北京</option>
        <option>上海</option>
        <option>广州</option>
    </select>
    <br>

    个人描述：
    <textarea rows="5" cols="20" name="desc"></textarea>

    <br>
    <input type="submit" value="免费注册">
    <input type="reset" value="重置">
    <input type="button" value="一个按钮">

</form>
</body>