html的国际标准,web标准教程，帮你走进web标准设计的世界第三讲（html终结篇）...

上一讲我主要讲解了一下网页常用的几个html标签。

非常感谢网友对我的大力支持&＃xff0c;谢谢你们给我的鼓励&＃xff01;

本节我将给大家讲解表单标签和table标签&＃xff0c;ok&＃xff0c;Begin&＃xff01;Right now&＃xff01;

标签10&＃xff1a;表单标签

功能&＃xff1a;构造一个表单&＃xff0c;用来向服务器提交数据

基本结构与详细标签&＃xff1a;

a&＃xff1a;input标签

使用指数&＃xff1a;*****

功能&＃xff1a;通过改变type类型来构造表单元素

类型&＃xff1a;内联元素

常用属性&＃xff1a;id&＃xff0c;class&＃xff0c;name(与ID类似&＃xff0c;方便后台程序获取标签的值)&＃xff0c;accept(accept 属性只能与 配合使用。它规定能够通过文件上传进行提交的文件类型。)

type与对应值一览

其中值img很少使用&＃xff0c;他与值submit的功能是相同的&＃xff0c;hidden值对于一个前台开发者而言几乎是用不到的&＃xff0c;button值暂时不做介绍&＃xff0c;毕竟我们现在离Javascript还很遥远&＃xff0c;呵呵

b:textarea标签

使用指数&＃xff1a;****

功能&＃xff1a;无限的向其中输入文本&＃xff0c;比较适合做留言板&＃xff0c;其中的文本的默认字体是等宽字体(通常是 Courier)

类型&＃xff1a;内联元素

常用属性&＃xff1a;id&＃xff0c;class&＃xff0c;name

特殊属性&＃xff1a;cols&＃xff0c;rows来设置他的区域大小&＃xff0c;不过不推荐这种设置&＃xff0c;还是建议通过css来设置(又是后话了)&＃xff01;

c: fieldset和legend标签

使用指数&＃xff1a;**

功能&＃xff1a;用来给你的表单划分区域&＃xff0c;在legend中设置区域的标题(不是很常用)

类型&＃xff1a;块级元素

常用属性&＃xff1a;id&＃xff0c;class&＃xff0c;title

d:label标签

使用指数&＃xff1a;***

功能&＃xff1a;没有任何效果&＃xff0c;只是为input标签提供一个标记不过&＃xff0c;它为鼠标用户改进了可用性。如果您在 label 元素内点击文本&＃xff0c;就会触发此控件。就是说&＃xff0c;当用户选择该标签时&＃xff0c;浏览器就会自动将焦点转到和标签相关的表单控件上。

特殊属性for:

标签的 for 属性应当与相关元素的id属性相同。通过这种方法来与对应标签绑定

例子&＃xff1a;

代码如下:

苹果

梨

香蕉

草莓

点击梨&＃xff0c;苹果会被选中&＃xff0c;点击苹果&＃xff0c;梨会被选中&＃xff0c;点击香蕉&＃xff0c;香蕉会被选中&＃xff0c;点击草莓&＃xff0c;草莓不会被选中&＃xff0c;因为他没有应用label&＃xff0c;这时只有点击按钮()才会被选中。

e:select标签

使用指数&＃xff1a;***

功能&＃xff1a;创建单选或者多选的下拉菜单

结构&＃xff1a;

代码如下:

Volvo//每一个选项

Saab

Opel

Audi

这些属性就不详细讲了&＃xff0c;大家去实践一下就明白了&＃xff0c;很简单

下面通过一个例子在具体应用表单标签要注意的事项&＃xff1a;

代码如下:

标签11&＃xff1a;table

使用指数&＃xff1a;***

功能&＃xff1a;构造一个表格

类型&＃xff1a;块级元素

常用属性&＃xff1a;id&＃xff0c;class

width&＃xff1a;设置表格的宽度

border&＃xff1a;设置表格的边框

标签a&＃xff1a;caption

使用指数&＃xff1a;*

功能&＃xff1a;为表格定义一个标题

类型&＃xff1a;块级元素

标签b&＃xff1a;tr

使用指数&＃xff1a;***

功能&＃xff1a;为表格定义一个行

类型&＃xff1a;块级元素

标签c&＃xff1a;th

使用指数&＃xff1a;**

功能&＃xff1a;为表格的每一列定义一个小标题&＃xff0c;默认字体加粗

类型&＃xff1a;块级元素

标签d&＃xff1a;td

使用指数&＃xff1a;***

功能&＃xff1a;为表格定义一个列

类型&＃xff1a;内联元素

特殊属性&＃xff1a;1.colspan&＃xff1a;合并单元格(列合并)

2.rowspan&＃xff1a;合并单元格(行合并)

例子&＃xff1a;

代码如下:

效果&＃xff1a;

到这里html就讲完了&＃xff0c;不要惊讶&＃xff0c;我指的是主要的常用的部分讲完了&＃xff0c;其他的就大家自己去学习吧&＃xff0c;相信掌握了学习方法之后的工作是愉快的&＃xff0c;哈哈

下一讲&＃xff0c;我将带领大家步入css的世界当中&＃xff01;