CSS表:在悬停时更改背景,包括替代行

Question

我创建了一个带有表格的示例页面.如果页面将来被删除,这里是 Pastebin 上的代码.

我想在悬停时突出显示表格行.它适用于普通tr,但它不适用于tr.alt(奇数行).

突出显示代码:

tr:hover,tr.alt:hover
{
background: #f7dcdf;
}

使奇数行不同颜色的代码:

tr.alt td
{
background: #daecf5;
}

任何想法如何解决这个问题？

Answer 1

确保悬停效果的规则低于.alt颜色,因为这会覆盖以前的规则或添加 !important

tr:hover,tr.alt:hover
{
    background: #f7dcdf!important;
}

另请注意,您将.alt行的背景颜色应用于单元格(td's),此颜色将显示在tr背景的"前面",因此请更改规则,以便两者都用于单元格或整行