【htlm5】table标签结构学习

一、HTML table标签结构

html 中table标签的结构情况，如下所示：

<!-- table标签结构如下：
    <table>
        <thead>　　　　　　　　　     # thead表格头部分，
            <tr>　　　　　　　　　 　 #tr 是table中的列，
                <th>标题</th>　　　  #th 是table中的标题部分的行
                <th>标题</th>
                <th>标题</th>
            </tr>
        </thead>

        <tbody>　　　　　　　　　   　#tbody 表格主题部分
            <tr>　　　　　　　　　　  #tr 是table中的列
                <td>内容</td>　　　　#td 是table中主题部分的行
                <td>内容</td>
                <td>内容</td>
            </tr>
        </tbody>
    </table>    
-->

 

二、HTML中表格元素TABLE,TR,TD及属性的语法

（1）table:表格元素及属性

属性说明
width	表格宽度，单位为%或象素
border	表格边框线的粗细
cellspacing	表格间距
cellpadding	表格边距
bgcolor	表格背景颜色
bordercolor	表格边框线的颜色
align	表格的对齐方式： 　　居中center　左对齐left　　右对齐right

（2）属性说明举例：

　　以下代码可以直接复制粘贴运行，通过运行结果我们可以更感谢的认识下table这个结构标签。

<table width="80%" border="1" cellspacing="1" cellpadding="4" bgcolor="#CC99FF" bordercolor="#0000FF" align="center">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

 

其他：

　　tr:行元素

　　td:列元素

　　tr,td元素的属性基本相同，但增加行合并属性colspan="2"　和　列合并属性rowspan="2"。