HTML put＆＃34;章节＆＃34;在桌子上

Question

我是HTML的新手，我已经习惯了使用CSS。

我的问题是：

我想放置一个不同颜色和不同文本对齐方式的分隔符。

这是一个例子：

我想复制＆＃34;围攻引擎＆＃34;和＃34;重武器＆＃34;

到目前为止，我设法做到了这一点：

<style>
tr:nth-child(1) {background-color: #11599c}

tr:nth-child(even) {background-color: #333333}

table
{
    text-align: left;
    border-collapse: collapse;
    background-color: #666666;
    color: #ffffff
}
</style>
<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th> 
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td> 
    <td>50</td>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td> 
    <td>50</td>
  </tr>

  <tr>
        <td colspan="3" class="divider">Divider</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
    <td>94</td>
  </tr>
</table>

但是分隔符是左对齐和灰色的：

我该怎么做才能使它居中对齐和黑色？

注意：我已经部分回答了我自己的问题。

Answer 1

把这个

.divider{
   text-align:center;
   background-color:black;
}

示例fiddle。