HTML之表单

form 为比表单元素，它的 action属性表示提交地址，method 表示提交方式 有 post/get 两种 ，前者更为安全。它其中有很多属性可以实现很多功能，具体如下。

1、input

input中有如下属性：

• type：类型
• name: 名字 , 可以重复
• id: 不能重复,保证全代码唯一
• disabled: 禁用文本框

其中 type属性 有 text（文本框）、password（密码框）、file（文件域）、radio（单选框）、checkbox（多选框）、button（按钮）这些选项。分别实现不同的功能，具体代码如下：

<form action="1.第一网页.html" method="get">
    <!--文本框 : input type=text-->
    <!--required表示必填项-->
    <p>用户名 : <input type="text" name="username" placeholder="请输出用户名" required > </p>
    <!--密码框 : input type=password -->
    <p>密码 : <input type="password" name="password" required> </p>
    <p>确认密码 : <input type="password" name="password"> </p>

    <p>
        <!--文件域-->
        <input type="file">
    </p>

    <p>
        <!--checked 默认选中-->
        <!--
        注意事项:
            1. 若是要提交 , 则必须要有 name 和value属性
            k=v&k=v&k=v&k=v&k=v&k=v
            2. name就是key 提交的键 , value就是提交的信息
        -->
        性别
        <input type="radio" value="boy" name="group1" checked>男
        <input type="radio" value="girl" name="group1">女
    </p>
    <p>
        <!--
        注意事项:
        1. 若是要提交 , 则必须要有 name 和value属性
        k=v&k=v&k=v&k=v&k=v&k=v
        2. name就是key 提交的键 , vlaue就是提交的信息
        -->
        爱好
        <!-- checkbox多选框-->
        <input type="checkbox" value="movie" name="hobby"/>看电影
        <input type="checkbox" value="music" name="hobby"/>听歌
        <input type="checkbox" value="road" name="hobby"/>逛街
        <input type="checkbox" value="code" name="hobby"/>敲代码
    </p>
     <p>
        <input type="button" value="我的第一个button按钮">
    </p>
    </form>

2、selected

selected 表示下拉框，然后用 option 设置每个下拉框的选项，具体代码如下：

<!--selected表示默认显示的选项-->
 <select name="中国">
        <option value="选择的值1">河南</option>
        <option value="选择的值2">陕西</option>
        <option value="选择的值3" selected>北京</option>
    </select>

3、textarea

textarea 表示文本域，可以用 cols 和 rows 属性来设置文本域的列和行数，实例代码如下：

 <textarea name="textarea" cols="2" rows="10">
           这是一个文本域
 </textarea>

4、提交按钮和重置按钮

当 input 的 type 属性设置为 submit 的时候，这个按钮就是提交按钮，设置为 rest 的时候表示重置按钮，实例代码如下：

 <p>
        <input type="submit" value="提交">
        <input type="reset" value="重置">
    </p>

我们可以用 value 来设置按钮上的文字

5、滑块

滑块就是把 input 的 type 设置为 range 即可，可以用 value 来设置滑块默认在的位置（0~100）实例代码如下：

 <input type="range" name="range" value="30">