阿邦教育频道>dreamweaver>HTML基础> 正文

xhtml表格标签详解

table是传统网页布局的常用标签,它允许我们把各种内容、数据放在表格单元格内,如:文本、图片、链接、表格等等。

但那只是在DIV+CSS布局流行之前,在xhtml时代,我们不推荐使用table来进行布局和定位,但table因为它突出的特性还拥有相当多的用武之地。

table、tr、td标签

table这个标签用起来可能比较麻烦,因为它独自使用不会出现任何效果,必须伴随着tr、和td等标签才能出现效果。首先它需要用<tr>标签将表格划分成行,然后在用<td>将它划成一个个小单元格。如果手动写代码是一件很吃力的事情,不过幸好有Dreamweaver、Frontpage等所见即所得的网页设计软件帮忙,让插入表格这件事变得直观且快速。

border属性

table标签可以有一个border属性,它的值可以设置表格边的宽度,它的默认值是“0”,如果不设置这个属性表格将不会出现边框。

例子:

我们先建立一个两行两列的表格,代码如下:

<table border="1"><!--表格开始,边框宽度为1-->
<tr><!--tr标签先分出第一行-->
<td>单元格一</td><!--td标签先分出第一列-->
<td>单元格二</td><!--td标签先分出第二列-->
</tr>
<tr>
<td>单元格三</td>
<td>单元格四</td>
</tr>
</table>
效果如下图
表格标签示例[点击放大]
表格标签示例 来源:黄超

其他属性:

cellpadding、cellspacing、colspan、rowspan四个属性也是常用的。

cellpadding表示在表格内容和边框之间空白,即单元格内补丁。

cellspacing表示单元格间距。

colspanrowspan是在拆分合并单元格时用到的属性,colspan规定此单元格可横跨的列数,colspan规定此单元格可横跨的行数。

这里我们只做一下简短的介绍,等我们制作表格实例的时候再进行详细讲解。



留言板
不错 微笑 撇嘴 害羞 不行 疑惑 调皮
惊恐 困了 近视 喜欢 努力 可怜 伤心
留言规则》