jquery - 为什么标题行在我的 HTML 表格中没有显示边框？

Question

我的 HTML 表格有以下 CSS 代码，但由于某种原因，边框没有超过标题行 (<th>)。这绝对是我想念的简单的东西，但我似乎无法弄清楚。

#dependenciesTable tr.odd {
    background-color: #ffffff;
}

#dependenciesTable tr.even {
    background-color: #CDE0F6;
}

#dependenciesTable
{
    border-collapse:collapse;
    border-width: 1px;
    border-style: solid;
}

我正在使用 jQuery添加这些奇偶条纹。

$('#dependenciesTable tr:odd').addClass('odd');
$('#dependenciesTable tr:even').addClass('even');

Answer 1

详细说明 Superstringcheese 的回答:

当您尝试根据 <tr> 设置样式时，某些浏览器(IE，咳咳)会表现得很奇怪s，因为从概念上讲，它们只是要容纳的元素 <td> s 和 <th>秒。所以，您想将 CSS 更改为:

#dependenciesTable td.odd {
    background-color: #ffffff;
}

#dependenciesTable td.even {
    background-color: #CDE0F6;
}

#dependenciesTable 
{
    border-collapse:collapse;
    border-width: 1px;
    border-style: solid;
}

还有你的 jQuery 代码:

$('#dependenciesTable tr:odd td').addClass('odd');
$('#dependenciesTable tr:even td').addClass('even');