8.表格

第八节表格

1.标准的表格

table:表格标签

aligh:对齐方式

cellpading:规定单元边沿与其内容之间的空白。

cellspacing:属性规定的是单元之间的空间

tr:行

td:列

th:表头

横向合并

colsapn=“number”:合并横向的表格

代码:

  <table border="1px" align="center" cellpadding="0px" cellspacing="0px" width="800px">
  	<tr>
  		<th colspan="3">横着的表头</th>
  	</tr>
  	<tr>
  		<th>表头1</th>
  		<th>表头2</th>
  		<th>表头3</th>
  	</tr>
  	<tr>
  		<td>1</td>
  		<td>1</td>
  		<td>1</td>
  	</tr>
  	<tr>
  		<td>1</td>
  		<td>1</td>
  		<td>1</td>
  	</tr>
  	<tr>
  		<td>1</td>
  		<td>1</td>
  		<td>1</td>
  	</tr>
  </table>

演示:

横着的表头
表头1	表头2	表头3
1	1	1
1	1	1
1	1	1

竖向合并

rowspan=“number”:合并竖向的表格

代码:

<table border=“1px” align=“center” cellpadding=“0px” cellspacing=“0px” width=“800px”>

竖着的表头
表头1
1
1
1


表头1
1
1
1


表头1
1
1
1


表头1
1
1
1

演示:

竖着的表头	表头1	1	1	1
	表头1	1	1	1
	表头1	1	1	1
	表头1	1	1	1

2.表格的框架

框架主要的区别就是在于表格的边框的方向不一样

box框架

代码:

<table frame=“box” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>

months
saves


January
$400


May
$400

演示:

months	saves
January	$400
May	$400

above框架

代码:

<table frame=“above” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>

months
saves


January
$400


May
$400

演示:

months	saves
January	$400
May	$400

below框架

代码:

<table frame=“below” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>

months
saves


January
$400


May
$400

演示:

months	saves
January	$400
May	$400

hsides框架

代码:

<table frame=“hsides” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>

months
saves


January
$400


May
$400

演示:

months	saves
January	$400
May	$400

vsides框架

代码:

<table frame=“vsides” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>

months
saves


January
$400


May
$400

演示:

months	saves
January	$400
May	$400

hsides框架

代码:

<table frame=“hsides” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>

months
saves


January
$400


May
$400

演示:

months	saves
January	$400
May	$400

lhs框架

代码:

<table frame=“lhs” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>

months
saves


January
$400


May
$400

演示:

months	saves
January	$400
May	$400

rhs框架

代码:

<table frame=“rhs” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>

months
saves


January
$400


May
$400

演示:

months	saves
January	$400
May	$400