1、HTML 表单
表单是一个包含表单元素的区域。
表单元素是允许用户在表单中输入内容,比如:文本域(textarea)、下拉列表(select)、单选框(radio-buttons)、复选框(checkBox) 等等。
我们可以使用 <form> 标签来创建表单:
<form>
input 元素
</form>
action 表单要提交的服务器的地址
输入类型是由 type 属性定义。
2、常用的输入类型
- 文本域(Text Fields)
文本域通过 <input type="text"> 标签来设定,当用户要在表单中键入字母、数字等内容时,就会用到文本域。
实例
<form>
First name: <input type="text" name="firstname"><br>
Last name: <input type="text" name="lastname">
</form>
浏览器显示如下:
注意:表单本身并不可见。同时,在大多数浏览器中,文本域的默认宽度是 20 个字符。
- 密码字段
密码字段通过标签 <input type="password"> 来定义:
实例
<form>
Password: <input type="password" name="pwd">
</form>
- 提交按钮(Sumbmit)
<input type="submit"> 定义了提交按钮。
当用户单击确认按钮时,表单的内容会被传送到服务器。表单的动作属性 action 定义了服务端的文件名。
实例
<form name="input" action="html_form_action.PHP" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>
- 单元按钮(Radio Buttons)
<input type="radio"> 标签定义了表单的单选框选项:
实例
<form action="">
<input type="radio" name="sex" value="male">男<br>
<input type="radio" name="sex" value="female">女
</form>
下:
- 复选框(CheckBoxes)
<input type="checkBox"> 定义了复选框。
复选框可以选取一个或多个选项:
实例
<form>
<input type="checkBox" name="vehicle" value="Bike">我喜欢自行车<br>
<input type="checkBox" name="vehicle" value="Car">我喜欢小汽车
</form>