网页表格边框颜色效果

2007-08-23 21:57:00

今天在写网页时用了一个表格，设定了边框的颜色后在Firefox里却没效果，于是就用CSS来试了一下，成功了。

以下是我原先写的代码Code-01：

<body>
<p align="center">
<table border="2" bordercolor="blue" align="center">
  <tr>
  <th>One</th> <th>Two</th> <th>Three</th> <th>Four</th>
  </tr>
  <tr>
   <td bordercolor="red">11</td> <td>12</td> <td>13</td> <td>14</td>
  </tr>
  <tr bordercolor="yellow">
   <td>21</td> <td>22</td> <td>23</td> <td>24</td>
  </tr>
</table>
</p>
</body>
</html>

下面是浏览结果：

IE浏览器浏览结果图1

Firefox浏览器浏览结果图2

后来找到了解决方案，看下面的代码段Code-02：

Test.css代码--

#table1
{
border:2px solid;
border-color:red;
}

#table2
{
  border:4px solid;
  border-color:blue;
}

#table1 td
{
  border:1px solid;
  border-color:blue;
}

#table1 th
{
  border:1px solid;
  border-color:yellow;
}

a.html代码--

<body>
<p align="center">
<table id="table1">
  <tr>
   <th>One</th> <th>Two</th> <th>Three</th> <th>Four</th>
  </tr>
  <tr>
   <td>11</td> <td>12</td> <td>13</td> <td>14</td>
  </tr>
  <tr>
   <td>21</td> <td>22</td> <td>23</td> <td>24</td>
  </tr>
</table>

<br>

<table id="table2">
  <tr>
   <th>One</th> <th>Two</th> <th>Three</th> <th>Four</th>
  </tr>
  <tr>
   <td>11</td> <td>12</td> <td>13</td> <td>14</td>
  </tr>
  <tr>
   <td>21</td> <td>22</td> <td>23</td> <td>24</td>
  </tr>
</table>
</p>
</body>
</html>

下面是浏览器中浏览的结果图：