表格＜table＞

HTML表格布局 <table>

1.表格的定义

        <table> 标签定义 HTML 表格，一个简单的html表格，包含两行两列。简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。

<table>
		<tr>
			<td>姓名</td>
			<td>年龄</td>
		</tr>
		<tr>
			<td>张三</td>
			<td>18</td>
		</tr>
	</table>

 tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元。HTML 表格也可能包括 caption、col、colgroup、thead、tfoot 以及 tbody 等元素。

2.表格常用的属性

属性	值	描述
align	left、center、right	不赞成使用。请使用样式代替。 表示表格相对周围元素的对齐方式。
width、height	pixels、%(表格在这个容器里面的百分比)	表示表格的宽度和高度
border	pixels	表示表格边框的宽度，当border="0"时，表示无边框，当border里面的值>1时，边框的尺寸越来越大。
bgcolor		不赞成使用。请使用样式代替。 表示表格的背景颜色。
cellspacing		表示单元格之间的距离
cellpadding		表示单元边沿与单元内容之间的距离
frame	void、above、below、hsides、lhs、rhs、vsides、box、border	表示外侧边框的哪个部分是可见的。
rules	none、groups、rows、cols、all	表示内侧边框的哪个部分是可见的。
summary	test	表示表格的摘要

 

 

 

 

 

 

 

 

 

 

 

 

3.表格的嵌套

<table width="300" height="" border="1">
		<tr>
			<td>张三</td>
			<td>
			<table border="1">
				<tr>
					<td>王五</td>
					<td>
						<table border="1">
							<tr>
								<td>李四</td>
							</tr>
						</table>
					</td>
				</tr>
			</table>
			</td>
		</tr>
</table>

 

4.表格的合并

属性	描述
rowspan	垂直方向合并的是行
colspan	水平方向合并的是列

 

 

 

 

 

<table border="1" width="300">
		<tr>
			<td rowspan="2">&nbsp;</td>
			<td >&nbsp;</td>
			<td>&nbsp;</td>
		</tr>
		<tr>
			<td colspan="2">&nbsp;</td>
		</tr>
	</table>