李玉鹏的blog

两幅三维立体图，点击可以看大图

第一副送给天下有情人

第二副送给今天落单的人。
ps:喜欢蓝色

首先让我们看看一个普通的表格是如何写出来的：

<table>
  <caption>表格头</caption>
  <thead>
    <tr>
      <th>标题一</th>
      <th>标题二</th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <th colspan="2">表尾</th>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>内容一</td>
      <td>内容二</td>
    </tr>
  </tbody>
</table>

这段代码的现实效果如下：

表格头

标题一	标题二
表尾
内容一	内容二

以前在定义表格的居中，边框，还有字体颜色等等的时候，要写很多标签和class在html标签里，
现在，我们通过css，只要定义一个样式类：

table.tableline{
border-collapse: collapse;
width:80%;
font-size: 12px;
star:expression(this.align=’center’);
}
table.tableline th, table.tableline td{
margin:0px;
border:1px solid #808080;
}
table.tableline th{
background-color:#06c;
color:#000000;
}
table.tableline caption{
font-size:14px;
color:#347B01;
font-weight:bold;
}

再修改一下刚才代码的第一行：<table class=”tableline”>，
表格就会变成下面这个样子啦

表格头

标题一	标题二
表尾
内容一	内容二

css还是很神奇的～～～