HTML 表单的用法

HTML 表单是一个包含表单元素的区域。
表单元素是允许用户在表单中输入内容,比如:文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等。

Paste_Image.png

1.form的属性

QQ截图20170703185107.png

2.文本域(Text Fields)
文本域通过<input type="text"> 标签来设定,当用户要在表单中键入字母、数字等内容时,就会用到文本域。
<form>
First name: <input type="text" name="firstname">

Last name: <input type="text" name="lastname">
</form>

3.密码字段
密码字段通过标签<input type="password"> 来定义:
<form>
Password: <input type="password" name="pwd">
</form>

4.单选按钮(Radio Buttons)
<input type="radio"> 标签定义了表单单选框选项
<form>
<input type="radio" name="sex" value="male">Male

<input type="radio" name="sex" value="female">Female
</form>

5.复选框(Checkboxes)
<input type="checkbox"> 定义了复选框. 用户需要从若干给定的选择中选取一个或若干选项。
<form>
<input type="checkbox" name="vehicle" value="Bike">I have a bike

<input type="checkbox" name="vehicle" value="Car">I have a car
</form>

6.提交按钮(Submit Button)
<input type="submit"> 定义了提交按钮.
当用户单击确认按钮时,表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。
<form name="input" action="html_form_action.php" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>

7.<input type="reset">定义重置按钮
<input type="reset" name="button" id="button" value="重置">
点击之后会将重置按钮所在的表单中填写的内容清空。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一、表单 1. 表单的作用 HTML 表单用于接收不同类型的用户输入,用户提交表单时向服务器传输数据,从而实现用户...
    zx9426阅读 457评论 0 1
  • 一、HTML表单 表单是一个包含表单元素的区域。表单元素是允许用户在表单中输入内容,比如:文本域(textarea...
    饥人谷_李维超阅读 350评论 0 0
  • 1.简介 HTML表单是一个包含表单元素的区域,用来收集用户输入的内容并提交。表单元素通常包括文本域(textar...
    _思铭阅读 152评论 0 0
  • 1. 简介 HTML表单是一个包含表单元素的区域,用来收集用户输入的内容并提交。 表单元素通常包括文本域(text...
    yangjie727阅读 409评论 0 0
  • 这个嘛,我认可他,不是因为目前他的“江湖地位”,而是他的谨慎务实的态度! 我们一般都是中规中矩的大学毕业,开始找工...
    薛埠荟阅读 499评论 0 0