|
——此文章摘自《HTML与CSS入门经典》定价：39元 特价：29.25元 购买>>
11.4 表格背景和间距
程序清单11.2中还有一些技巧我没有介绍。可以指定整个表格——以及表格中的每行或每个单元格——的背景，该背景可能与网页本身使用的背景不同。为此，可在标签<table>、<tr>、<td>和<th>中指定样式 background-color 或background-image，就像在<body>标签中一样（参见第9章）。例如，要使整个表格都使用黄色背景，可用< table style="background- color:yellow">或等价的<table style="background-color:#FFFF00">。
与background-color类似的是background-image属性，后者用于设置一个图像作为表格背景。要将图像leaves.gif设置为表格背景，可用<table style="background-image:url (leaves.gif)"。注意，图像文件名放在括号中，前面加上前缀url，表明描述的是图像文件位置。
对表格的设置不仅可以使用style属性。例如，可用cellpadding和cellspacing属性来控制表格边框的间距。cellspacing属性设置表格边框之间和表格单元格之间的间距（以像素为单位）；cellpadding属性设置单元格中的信息四周的间距（也是以像素为单位）。如果将cellpadding属性设置为0，将使表格中的所有信息尽量接近表格边框，甚至接触到边框。cellpadding和 cellspacing属性让你能够全面控制表格的外观。
注意：虽然在XHTML中仍允许使用cellpadding和cellspacing属性，但CSS中存在与这两个属性等价的样式属性padding和 border-spacing。然而，当前的网页浏览器对这些样式属性的支持不一致，因此建议现在仍使用属性cellpadding和 cellspacing来调整表格的间距。
图11.2显示了背景颜色和间距的影响，图中的表头使用银色背景，表格中每个单元格的文本与图像离边框有一定的间距。
提示：可以将表格放在另一个表格的单元格中，这样内部的表格将拥有“父”表格的质量。换句话说，可以在表格中嵌套表格。
使用嵌套表格可以设计许多有创意的网页布局。例如，如果要使一列文本显示在表格的左边，可以创建一个两列的表格，将文本放在一列，子表格放在另一列，如下所示：
<table>
<tr>
<td>To the right, you see all our telephone numbers.</td>
<td>
<table border="1">
<tr>
<td>voice</td>
<td>802-888-2828</td>
</tr>
<tr>
<td>fax</td>
<td>802-888-6634</td>
</tr>
<tr>
<td>data</td>
<td>802-888-3009</td>
</tr>
</td>
</tr>
</table>
</table>
注意到内部表格有边框，而外部表格没有。
嵌套表格的一个缺点是，如果嵌套太深，浏览器渲染网页时可能很慢。如果没有很好的理由，嵌套的级别不应超过三级，尽量控制在两级以内。
| 
转播
