在桌附近的另外行边界颜色

时间:2016-07-24 12:02:22

标签: html css wordpress

我在wordpress上有一个简单的html表。我想为每一行设置不同的边框颜色,甚至在每一行周围创建一个小间隙。我怎么能这样做?

我试过这样的方式:

<table style="border-collapse: collapse;">
 <tbody>
  <tr style="border: 1px solid black;">
   <th>Zoo (Country)</th>
   <th>Date of Birth</th>
   <th>Name</th>
   <th>Dam (number of calves)</th>
   <th>Sire</th>
  </tr>
  <tr style="color: darksalmon; border: 1px solid green;">
   <td>Knowsley (UK)</td>
   <td>2 Jan 2016</td>
   <td>Nomvula</td>
   <td>Meru (9)</td>
   <td>Sharka</td>
  </tr>
 </tbody>
</table>

但我得到了这个: html_error

您可以在其中看到绿色边框和黑色边框重叠

1 个答案:

答案 0 :(得分:1)

如果你想改变每一行的颜色,你需要为指定颜色的每一行传递一个不同的id。

对于你可以给一个班级的小差距,或者你可以做一些内联样式,如这个例子所示

<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
    border: 1px solid black;
}
</style>
</head>
<body>

<table>
  <tr border-color="#FF0000">
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>

<p>The bgcolor attribute is not supported in HTML5. Use CSS instead.</p>

</body>
</html>