HTML 表单标签

一、form标签

 <form method="post" action="success.html" name="" value=""> <form>

action设置提交服务器的地址;

method设置表单提交的方式

               (1)get 从服务器获取数据,也可以提交数据,数据会显示在窗口地址栏

               (2)post 提交数据给服务器 数据不会显示在窗口地址栏

name 设置数据存储的位置

value 设置存储的具体值

大多数的表单标签都是用input标签来实现的

二、单行文本框

<input type="text" placeholder="请输入用户名" >

单行文本框type取值为text, placeholder:文本框默认提示信息;  value: 文本框默认显示信息

三、密码文本框

<input type="password" placeholder="请输入密码">

type取值password

四、单选框和复选框

<input type="radio" name="gender" value="男" id="nan" checked> <label for="nan">男</label>
<input type="radio" name="gender" value="女" id="nv"> <label for="nv">女</label>

type取值radio

name表示单选框所在的组名,需要设置相同的组名进行绑定

label的特殊用法,for属性可以指定表单元素的id名,点击label里面的文本可以控制指定表单获取焦点(显示效果为单击文字也可以切换)

<input type="checkbox" checked>吃饭
<input type="checkbox">睡觉
<input type="checkbox">打豆豆

 type取值为checkbox

checked可以控制单选框和复选框默认选中

五、下拉列表

<select name="" id="" multiple>
    <option value="">身份证</option>
    <option value="">驾驶证</option>
    <option value=""selected>学生证</option>
</select>

下拉列表由select和option两个标签配合使用

下拉列表默认显示第一个,selected可以设置默认显示的选项

下拉列表默认是单选,设置multiple可以多选

六、文本域

    <textarea name="" id="" cols="30" rows="10"></textarea>

文本域由textarea标签构成,cols可以控制一行写多少个字符,rows可以控制显示多少行,间接控制文本域大小,后期会使用CSS

七、按钮


        <input type="button" value="登录">
        <input type="submit" value="提交">
        <input type="reset" value="重置"><br><br>


        <button type="button">普通按钮</button>
        <button type="submit">提交按钮</button>
        <button type="rest">重置</button>

重置按钮只能清空它所在form标签内的表单中的内容,对于当前所在form标签之外的表单清除无效,建议使用下面这种书写方式