html中用form单选框右侧提示汗字,HTML表单(Forms)解析

HTML表单(Form)是HTML的一个重要部分，主要用于采集和提交用户输入的信息。

举个简单的例子，一个让用户输入姓名的HTML表单(Form)。示例代码如下：

 请输入你的姓名：  

01.

02.

输入用户姓名

03.

04.

05.

06.

请输入你的姓名：

07.

08.

09.

10.

11.

12.

学习HTML表单(Form)最关键要掌握的有三个要点：

表单控件(Form Controls)

Action

Method

先说表单控件(Form Controls)，通过HTML表单的各种控件，用户可以输入文字信息，或者从选项中选择，以及做提交的操作。比如上面的例句里，input type= "text"就是一个表单控件，表示一个单行输入框。

用户填入表单的信息总是需要程序来进行处理，表单里的action就指明了处理表单信息的文件。比如上面例句里的http://www.php100.com/html/asdocs/html_tutorials/yourname.php。

至于method，表示了发送表单信息的方式。method有两个值：get和post。get的方式是将表单控件的name/value信息经过编码之后，通过URL发送(你可以在地址栏里看到)。而post则将表单的内容通过http发送，你在地址栏看不到表单的提交信息。那什么时候用get，什么时候用post呢？一般是这样来判断的，如果只是为取得和显示数据，用get；一旦涉及数据的保存和更新，那么建议用post。

HTML表单(Form)常用控件(Controls)

HTML表单(Form)常用控件有：

表单控件(Form Contros)

说明

input type="text"

单行文本输入框

input type="submit"

将表单(Form)里的信息提交给表单里action所指向的文件

input type="checkbox"

复选框

input type="radio"

单选框

select

下拉框

textArea

多行文本输入框

input type="password"

密码输入框(输入的文字用*表示)

表单控件(Form Control)：单行文本输入框(input type="text")

单行文本输入框允许用户输入一些简短的单行信息，比如用户姓名。例句如下：

01.

02.

输入用户姓名

03.

04.

06.

请输入你的姓名：

07.

08.

09.

10.

11.

12.

表单控件(Form Control)：复选框(input type="checkbox")

复选框允许用户在一组选项里，选择多个。示例代码： 苹果桔子芒果

01.

02.

选择

03.

04.

请选择你喜欢的水果：

06.

苹果

07.

桔子

08.

芒果

09.

10.

11.

12.

用checked表示缺省已选的选项。 桔子

01.

02.

选择

03.

04.

请选择你喜欢的水果：

06.

苹果

07.

桔子

08.

芒果

09.

10.

11.

12.

表单控件(Form Control)：单选框(input type="radio")

使用单选框，让用户在一组选项里只能选择一个。示例代码： 苹果桔子芒果

01.

02.

选择

03.

04.

请选择你最喜欢的水果：

06.

苹果

07.

桔子

08.

芒果

09.

10.

11.

12.

13.

用checked表示缺省已选的选项。 桔子

01.

02.

选择

03.

04.

请选择你最喜欢的水果：

06.

苹果

07.

桔子

08.

芒果

09.

10.

11.

12.

13.

表单控件(Form Control)：下拉框(select)

下拉框(Select)既可以用做单选，也可以用做复选。单选例句如下：    苹果   桔子   芒果 

01.

02.

04.

你最喜欢的水果是：

05.

06.

苹果

07.

桔子

08.

芒果

09.

10.

11.

12.

13.

如果要变成复选，加muiltiple即可。用户用Ctrl来实现多选。例句：

01.

02.

选择

03.

05.

你最喜欢的水果是：

06.

07.

苹果

08.

桔子

09.

芒果

10.

11.

12.

13.

14.

15.

用户还可以用size属性来改变下拉框(Select)的大小。

01.

02.

选择

03.

04.

06.

你最喜欢的水果是：

07.

08.

苹果

09.

桔子

10.

芒果

11.

12.

13.

14.

15.

表单控件(Form Control)：多行输入框(textarea)

多行输入框(textarea)主要用于输入较长的文本信息。例句如下：

其中cols表示textarea的宽度，rows表示textarea的高度。

01.

02.

请提宝贵意见

03.

04.

06.

请提宝贵意见：

07.

08.

09.

10.

11.

12.

13.

表单控件(Form Control)：密码输入框(input type="password")

密码输入框(input type="password")主要用于一些保密信息的输入，比如密码。因为用户输入的时候，显示的不是输入的内容，而是黑点符号。。例句如下：

01.

02.

输入用户姓名和密码

03.

04.

06.

请输入你的姓名：

07.

08.

请输入你的密码：

09.

10.

11.

12.

13.

14.

15.

表单控件(Form Control)：提交(input type="submit")

通过提交(input type=submit)可以将表单(Form)里的信息提交给表单里action所指向的文件。例句如下：

01.

02.

输入用户姓名

03.

04.

06.

请输入你的姓名：

07.

08.

09.

10.

11.

12.

表单控件(Form Control)：图片提交(input type="image")

input type=image 相当于 input type=submit，不同的是，input type=image 以一个图片作为表单的提交按钮，其中 src 属性表示图片的路径。

01.

02.

输入用户姓名

03.

04.

06.

请输入你的姓名：

07.

08.

09.

alt ="提交" NAME="imagesubmit">

10.

11.

12.

13.