HTML 将 "chapters"放在表格上

Question

我是 HTML 的新手，但我正在习惯使用 CSS。

我的问题是:

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

举个例子:

我想复制“攻城车”和“重型武器”

到目前为止，我所做的是:

<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 .