html表单,html表单标签有哪些

HTML中常用的表单元素

1、input 元素定义输入框，根据不同的?type?属性，可以变化为多种形态。例如：

input type=text表示文本输入框，input type=password表示密码输入框，input type=radio表示单选输入框，input type=checkbox表示复选输入框。

2、select?元素定义下拉列表；

3、option?元素定义待选择的选项；列表通常会把首个选项显示为被选选项。能够通过添加 selected 属性来定义预定义选项；

4、textarea?元素定义多行输入字段（文本域）；

5、button?元素定义可点击的按钮；

6、datalist?元素为 input 元素规定预定义选项列表；用户会在他们输入数据时看到预定义选项的下拉列表。

在html中什么标签用于网页中创建表单

form标签

定义和用法

form 标签用于为用户输入创建 HTML 表单。

表单能够包含?input 元素，比如文本字段、复选框、单选框、提交按钮等等。

表单还可以包含?menus、textarea、fieldset、legend?和?label 元素。

表单用于向服务器传输数据。

提示和注释

注释：form 元素是块级元素，其前后会产生折行。

HTML 4.01 与 HTML5之间的差异

HTML5 新增了两个新的属性：autocomplete 和 novalidate，同时不再支持 HTML 4.01 中的某些属性。

HTML 与 XHTML 之间的差异

在 XHTML 中，name 属性已被废弃。使用全局 id 属性代替。

表单怎么做html

1、html文件是最常见的网页文件，所谓HTML是超文本标记语言（HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。

2、html文件的编辑非常简单，使用文本编辑器就可以打开，也可以使用editplus，vim，notepad++，ultraEdit 等等编辑工具打开，打开就可以直接看到源码，也可以进行编辑修改。

3、如果是想看HTML页面呈现的效果，可以使用浏览器打开。不同的浏览器可能显示效果会有不一致。

4、表单的话，可以直接使用table来实现，就是俗称的表格标签。

5、希望对你有帮助。

怎样用html写表单的教程

我们在浏览一些网站时经常会用到一种网页元素--表单。如下图，像这样允许用户输入并使用按钮提交信息的功能，我们称之为表单，那么接下来介绍HTML表单相关的一些知识点。

1)表单:帮助服务器收集客户端信息的一种机制

form?action="提交到的页面"?method="提交的方法"

表单控件

form

action:数据最后所提交的页面 绝对路径/相对路径

method:数据提交服务器时的提交方法 post get

2)表单控件:表单用于用户填写信息的控件

1、文本控件: 用于用户填写较少信息，且可以显示用户填写信息的控件

(注册时，用户名填写)

格式:

input?type="text"?name=""??id=""??value=""?size=""?placeholder=""/

type:设置控件样式 text

name:用于表单收集信息的一种标示符，也就是控件的名称

2、密码框:只是用户输入的内容看不到

input?type="password"?name=""?id=""??size=""/

3、单选按钮组:由多个单选按钮组成的按钮组，只能选中其中一个，这种按钮组

input?type='radio'?name=""?value=""?checked标示符

name:为了保证传递服务器数据只有一个，所以name值必须相同

value：是用提交服务器时，该标签被提交的数据,value不能相同;

checked:默认按钮组中的那个按钮被选中

性别:input?type='radio'?name=""?value=""?checked男

input?type='radio'?name=""?value=""?checked女

input?type='radio'?name=""?value=""?checked保密

所有表单控件name值不能相同!!!

4、复选按钮组: 与单选按钮组的区别可以选择多个，为了能将用户选择的多项内容传递服务器中，要将name名字后面加个[]

格式:

input?type='checkbox'?name=""?id=""?value=""?checked标示

选课:

input?type='checkbox'?name='classes[]'?checked?value='1'语文

input?type='checkbox'?name='classes[]'??value='2'数学

input?type='checkbox'?name='classes[]'??value='3'历史

input?type='checkbox'?name='classes[]'??value='4'政治

input?type='checkbox'?name='classes[]'??value='5'物理

input?type='checkbox'?name='classes[]'??value='6'化学

input?type='checkbox'?name='classes[]'?checked?value='7'美术

注意：一定要在name属性后面添加[]

5)下拉列表框:

格式:

select?name=""?

option?value=""?selected下拉列表项option

option?value=""?下拉列表项option

option?value=""?下拉列表项option

option?value=""?下拉列表项option

option?value=""?下拉列表项option

select

multiple:允许用户选中多个下拉列表项

optgroup: 设置下拉分类标示

6) 文本域：可以输入多行数据的表单控件

textarea?name=""?id=""?cols=""?rows=""

内容

textarea

rows:设置文本域可以输入的行数

cols:设置的文本域输入的列数(一行可以输入多少个字符)(不是PX)

个人介绍:

textarea?name='descs'?cols="50"?rows="10"

我是个学生

textarea

7)隐藏域：

input?type="hidden"?name?=?“”value?=””

8)上传控件：

input?type="file"?name=””

9)按钮标签:

普通按钮:为js提供的控件

input?type='button'?name=””?value=""/

value：按钮中显示的数据和提交到服务器后该控件提交的值

input?type='button'?name='clicks'?value="点我"/

提交按钮:点击后可以提交表单

input?type='submit'?name="add"?value='注册'/

重置按钮:点击后可以将用户输入的数据清空

input?type='reset'?name='cancel'?value='重置'

图片提交按钮:使用图片作为提交按钮

input?type='image'?src='图片地址'?name=””

本文的分享就到这，希望我的回答能帮到你。

HTML表单的用法

form 将表单元素包裹起来，受form包裹的表单元素才会提交给服务器。

form action=”地址” method=””

表单元素

/form

form标签是表单的外壳，主要有四个属性：

action：表单提交的地址（后台服务器地址）

method：提交表单的方法，两种请求方式，post、get

target：在何处打开action

enctype：（编码方式）

applocation/x-www-form-erlencoded 在发送前编码所有字符（默认）

text/plain：空格转换为”+”号，但不对特殊字符编码

multipart/form-data：使用包含文件上传控件的表单时，必须使用该值。例如：上传音频、视频。

1、区别：（体现在方式、安全、数据量三个方面）

- 方式，点击提交（发请求时），get将请求数据变成”k=value”的形式，然后组装到URL上。post方式提交请求时，数据通过浏览器传输给后台，但是URL没发生变化。

- 安全，get将信息组装到URL上，信息泄露，不安全；post方式的URL没发生变化更加安全。

- 数据量，浏览器地址栏能存放的字符有限的（容量有限），get方式的URL过于冗长，当超出限制时，浏览器自动截断URL，则传给后台的数据不完整，所以对数据大小有限制。而post方式的URL更干净、轻便，能完整地将数据传递给后台，无数据大小限制。

2、什么时候用get，什么时候用post（使用场景）

get：向后台查询东西，如查询论文；即向后台索要数据，用关键词来获取大量数据。安全性要求低，简单。

post：向后台传数据，例论文查重（数据很大，提交给后台）。安全性要求高。

是表单收集信息的元素，主要有以下属性：

label for="input_username"姓名：/label input type="text" name="username" id="input_username" placeholder="用户名"/

效果：

label for="input_password"密码：/label input type="password" name="password" id="input_password" placeholder="密码"/

效果：

效果：

效果：

label我的car：/label select name="transportation" option value="bus"公交/option option value="subway" selected地铁/option option value="taxi"出租车/option /select

效果：

label 评论：/label textarea name="recomment" placeholder="ddd" cols="60" rows="10"/textarea

效果：

label for="zjz"证件照：/label input type="file" name="photo" id="zjz" accept="image/jpg"/

其中accept规定了文件格式。

效果：

input type=”hidden” name=”abc” value=”123”

点击提交时，hidden里隐藏的数据也提交给了后台；abc=’123’

作用：（1）暂存信息，（用户看不到），便于设计者随时调用程序。

（2）用于安全性校验，例如通过设置hidden隐藏域，服务器可以验证用户权限，避免伪造的假网站提交数据。

input type="button" value="按钮"/

效果：

input type="submit" value="提交"/

效果：

input type="reset" value="复位"/

效果：

html表单元素有哪些

HTML中常用的表单元素包括：文本区域（TEXTAREA），列表框（SELECT），文本输入框（INPUT type=text），密码输入框（INPUT type=password），单选输入框（INPUT type=radio），复选输入框（INPUT type=checkbox），重置按钮、提交按钮、隐藏域、等等。

一、文本域input type="text" name="text" value="" /

二、密码域

密码跟文本框类似，但是在里面输入的内容显示为圆点。

input type="password" name="text" value="" /

三、单选按钮

男人:input type="radio" name="sex" value="male" / Malebr /

女人：input type="radio" name="sex" value="female" / Female

四、复选框

input type="checkbox" name="check1" value="" /

五、按钮

input type="button" value="确认" /

六、重置按钮

当点击重置按钮时，重置按钮所在的表单将全部清空，而其他表单不受影响。input type="reset" value="重置" /

七、提交按钮

当点击提交按钮时，浏览器将自动提交表单。input type="submit" value="提交" /

八、隐藏域

隐藏域在浏览器中并不显示，仅仅为保存一些不太重要的资料而存在。input type="hidden" value="我是一个隐藏域" /

九、上传域input type="file" value="" /

十、图片按钮input type="image" src="123.gif" /

十一、下拉列表select

option value="0"0/option

option value="1"1/option

option value="2"2/option

例如：

属性：disabled，可选值：disabled?，说明：规定禁用该下拉列表。 ?

十二、label

abel 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。例如，当将单选按钮放在label内。则点击label内的文字也会触发单选按钮，而不必只是点中小圆点。

例如：

labelinput type="radio" name="male" /男人/label/p

labelinput type="radio" name="male" /女人/label/p

十三、禁用（disabled）与只读（readonly）

禁用和只读属性。readonly只针对input(text / password)和textarea有效，而disabled对于所有的表单元素都有效，包括select, radio, checkbox, button等。但是表单元素在使用了disabled后，当我们将表单以POST或GET的方式提交的话，这个元素的值不会被传递出去，而readonly会将该值传递出去。

禁用文本框：input type="text" disabled="disabled" /

只读文本框: input type="text" readonly="readonly" //form

十四、TextArea

十五、fieldset ? ?定义域

fieldset用于给表单元素分组，legend用于设置分组标题。

表单在网页中主要负责数据采集功能。一个表单有三个基本组成部分： 表单标签，这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。表单域，包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。表单按钮，包括提交按钮、复位按钮和一般按钮；用于将数据传送到服务器上的CGI脚本或者取消输入，还可以用表单按钮来控制其他定义了处理脚本的处理工作。