HTML表格边框制作教程
 作者：灵子
  表格以<table>和</table>分别作起始标识符。其中，<table>里有一些必要的参数，为容易理解起见，在这里只介绍本节用到的参数，其他的参数今后将陆续提到。border参数定义表格边框的粗细，记为border=数值，数值取0，1，2，3等整数。width是我们要定义的参数，它规定表格的宽度，数值通常用100%，记作width=100%，值得注意的是，如果不设置width值，表格将根据单元格里的内容自动定义宽度。height参数规范表格的高度，通常可以不设置，而是让内容的多少让系统自行设定。

<table>和</table>之下，还需要由两个成对的标识符号定义表格的行、列，它们分别是<tr>……</tr>，<td>……</td>，tr标识符定义表中的行，td标识符定义数据表元，即每行中的每一列。<td>……</td>要包含在<tr>……</tr>里面。此外，论坛要求在<table>下有<tbody>（表体），它也是成对出现，包含<tr>...</tr>。一张完整的表格全部语法如下：
html网页设计 table
<table border=2 width=80%>
  <tbody>
    <tr>
        <td>Hello Table</td>
    </tr>
  </tbody></table>

效果如下：
Hello Table
 
表格边框的修饰

上一讲我们讲到border属性，border即为边框，除了有粗细的数值定义以外，还有其他的
属性哦。我们先来看看亮边框的颜和暗边框的颜设置。亮边框记作bordercolorlight，暗边框记作bordercolordark。它们的数值可以用red、green、blue等表达，也可以用#11ee00这样的方式来表达，比如：bordercolorlight=red，bordercolorlight=#808000。请看下面的表格：


以上表格的全部代码清单如下：

<table border=6 width=100% bordercolorlight=#008000 bordercolordark=#808000>
  <tbody>
  <tr>
    <td width=100%>Hello Table</td>
  </tr>
</tbody>
</table>

上表中，左、上边框是亮边框，右、下边框为暗边框。怎么样？这么一修饰就好看多了吧？

边框颜方面还有一个属性：bordercolor。当同时设置了暗、亮边框的颜，bordercolor
的颜设置是多余的，这一点应该注意。现在我们用bordercolor来设置一下表格边框，看看有什么效果：

Hello Table

代码清单：

<table border="10" width=100% bordercolor=#FF0000>
<tbody>
  <tr>
    <td width="100%">Hello Table</td>
  </tr>
</tbody>
</table>

上面我们学习的有关表格边框颜的设置，下面继续跟我学习表格边框其他方面的知识。

内容不多了，还讲两个表格边框的属性：一是边框线（cellpadding）粗细和边框空白处的大小，取值范围从0开始，用正整数。下面是代码和表格效果：

<table border=2 cellpadding=2 cellspacing=8 width=100%>
<tbody>
  <tr>
    <td width=100%>Hello Table 边框线:2 ，边框空白处:8</td>
  </tr>
</tbody>
</table>

Hello Table 边框线:2 ，边框空白处:8
 
表格背景的修饰

默认情况下，HTML网页里表格的背景是白的。这显然不总是符合我们的要求，我们通常会设置各种背景颜，以配合网页或贴子主题。

设置表格的背景很简单，给其bgcolor属性赋值即可，写作bgcolor=数值，其数值取值方式和上一讲讲到的边框颜是一致的，比如：bgcolor=black或bgcolor=#000000。bgcolor属性应该放置在表格初始符&>当中。下面举个实例，先是代码，后是效果：

<table border=10 cellpadding=2 width=100% bordercolorlight=#008000 bordercolordark=#008060 bgcolor=#CCCC00>
<tbody> 
  <tr>
    <td>
      <p align=left><font face=黑体 size=5 color=#800080>背景：bgcolor=#CCCC00<br> 
      暗边框颜：#008000<br>
      亮边框颜：#008060</font>
    </td>
  </tr>
  </tbody>
</table>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。