HTML 表单和输入

HTML表单的作用在于收集不同类型的用户输入。

HTML 表单

表单是包含表单元素的区域。表单元素允许用户在表单中输入内容，例如:文本、下拉列表、单选按钮、复选框等。

表单使用表单标签<form>来设置:

在多数情况下输入标签是使用到最多的表单标签（<input>）。

输入类型是由类型属性（type）定义的。

当用户要在表单中键入字母、数字等内容时，就会用到文本域。文本域通过<input type="text"> 标签来设定

<form>
第一个名字: <input type="text" name="firstname"><br>
第二个名字: <input type="text" name="lastname">
</form>

在浏览器上显示如下所示：

注意:表单本身是不可见的。另外，在大多数浏览器中，20 个字符啊文本域的默认宽度。

密码字段是通过标签<input type="password"> 来定义的:

<form>
密码: <input type="password" name="pwd">
</form>

在浏览器上出现如下效果：

注意:在密码字段里面的字符不会以明文方式显示，而是以星号或圆点替代。

在HTML中使用<input type="radio"> 标签定义了表单单选框选项

<form>
<input type="radio" name="sex" value="male">女<br>
<input type="radio" name="sex" value="female">男
</form>

在浏览器上得到如下的结果：

在HTML中使用<input type="checkbox"> 定义复选框. 如果用户需要从多个给定的选项中选取一个或多个

<form>
<input type="checkbox" name="vehicle" value="Bike">我有一辆自行车<br>
<input type="checkbox" name="vehicle" value="Car">我有一只猫
</form>

在浏览器上得到如下显示结果：

在HTML中<input type="submit"> 定义提交按钮

当用户单击确认按钮时，表单的内容将被传输到另一个文件。表单的action属性定义了目标文件的文件名。由action属性定义的文件通常处理接收到的输入数据<input type="submit"> 定义了提交按钮

<form name="input" action="html_form_action.php" method="get">
姓名: <input type="text" name="user">
<input type="submit" value="Submit">
</form>

在浏览器上显示结果是

如果在上面的文本框内输入几个姓名，然后点击确认按钮，那么我们输入的数据会传送到 "html_form_action.php" 的页面。然后这个页面会显示出输入的结果。

上一篇：HTML 列表下一篇：HTML 颜色

		自动登录	找回密码
密码			立即注册