HTML标签---表格

 目  录 

1.表格的结构

2.表格标签 

3.table标签的标签属性

4.表格的合并属性

---

1.表格的结构

在默认情况下，表格是没有边框的，如果想要出现边框，就是用border属性。

<table border="1">
            <tr>
                <th>姓名</th>
                <th>性别</th>
            </tr>
            <tr>
                <td>张三</td>
                <td>男</td>
            </tr>
            <tr>
                <td>李四</td>
                <td>女</td>
            </tr>
            <tr>
                <td>王五</td>
                <td>男</td>
            </tr>
        </table>

2.表格标签 

标签名	描述
table.../table	是用来在html页面上创建表格的
th.../th	代表列名一般放在第一行
tr.../tr	用来定义表格的一行
td.../td	用来定义表格的一列
caption.../caption	定义表格标题

3.table标签的标签属性

属性	属性值	描述
border	数字	只要不是0，边框就会显示出来，数字越大，最外圈边框会越粗
align	left，center，right	规定表格相对周围元素的对齐方式
bgcolor	颜色名或十六进制颜色表	规定表格的背景颜色
cellpadding	数字或百分数（例：1,10%）	规定单元边沿与其内容之间的空白
cellspacing	数字或百分数（例：1,10%）	规定单元格之间的空白
width	数字或百分数（例：1,10%）	规定表格的宽度。

<table border="1" bgcolor="pink" cellspacing="0" width="300">
			<tr >
				<th>姓名</th>
				<th>性别</th>
			</tr>
			<tr align="center">
				<td>张三</td>
				<td>男</td>
			</tr>
			<tr align="center">
				<td>李四</td>
				<td>女</td>
			</tr>
			<tr align="center">
				<td>王五</td>
				<td>男</td>
			</tr>
		</table>

补充：caption标签的属性只有align。th标签有属性align，bgcolor，height，width等等。

4.表格的合并属性

以下属性适用于th，tr，td标签，来实现上下纵向合并单元格或者左右横向合并单元格。需要注意的是，当实现了上下合并或左右合并，就应该减掉相应行中的列。

属性	属性名	描述
colspan	数字	左右合并，属性值为多少就合并多少个单元格
rowspan	数字	上下合并，属性值为多少就合并多少个单元格

<table border="3" width="500" height="200">
			<tr align="center" >
				<td colspan="2">ab</td>
				<td>c</td>
				<td>d</td>
			</tr>
			<tr align="center" >
				<td rowspan="2">ei</td>
				<td>f</td>
				<td>g</td>
				<td>h</td>
			</tr>
			<tr align="center">
				<td>j</td>
				<td>k</td>
				<td>l</td>
			</tr>
		</table>

---

(小编也在努力学习更多哟!以后再慢慢分享的啦!)

希望对友友们有所帮助!!!!