700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > a标签提交form表单_Web前端开发基础知识 HTML中表单元素的理解

a标签提交form表单_Web前端开发基础知识 HTML中表单元素的理解

时间:2020-10-02 13:04:04

相关推荐

a标签提交form表单_Web前端开发基础知识 HTML中表单元素的理解

表单

什么是HTML表单?

表单form是网页获取用户输入数据的一种方式,如图:

表单

表单中通常包括各种输入框、文本标签、提交按钮等。

1、一个简单的表单

首先要有一个form标签,其他表单控件放到from标签中,第一个是label标签用来描述后面的文本框中需要输入什么内容,然后是一个input标签,type的值是text表示是一个文本框,然后也是一个input标签,type的值是submit,表示是一个提交按钮,当然想要真正的提交数据还需要一些额外的属性。

学生姓名

2、form标签不但包含所有的表单控件,还会告诉浏览器当你提交表单的时候要把表单数据发送到哪里,以及使用什么方式发送。

action属性指定表单数据要发送到哪个服务器脚本上,例如这里发送到login.php ,method属性指定服务器发送的方式,有post和get两种方式,在表单当中常用post。

3、for属性和id属性

label标签for属性的值应该和input标签中id属性的值一致,这样这两个表单控件就会被关联起来。如下,这里将label关联到input上。

学生姓名

for属性

当我们点击文本标签"学生姓名"时候,文本框会自动获取输入光标,等待用户输入数据。

4、input标签的type属性

type属性决定input标签显示成什么样子,type属性种类很多,如下:

5、文本区域

input文本框标签可以接受少量的单行文本,textarea标签可以接受用户输入的多行文本,如下,和input标签不同,textarea标签必须有开始标签和结束标签。

总结

文本区域

6、下拉列表

使用select标签和option标签创建下拉列表

男女

综合示例:

学生信息

姓名 上传照片 性别 男 女班级 一班二班三班四班老师评语 考试通过

html表单

每天进步一点点,跟着教头学开发。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。