如何设置表格的每一行的背景颜色并在悬停时突出显示行？

Question

我试图为每隔一行创建一个具有不同背景颜色的表格，并在悬停时突出显示该行。它们都完美地分开工作，但是当你把它们放在一起时，悬停时的亮点不起作用。这是我的CSS。我可能必须通过使用Javascript来执行其中一个功能...

.tableData tr:hover {
background-color: #ffff99;
}

.tableData tr:nth-child(even) { /*(even) or (2n 0)*/
background: #f1f1f1;
}
.tableData tr:nth-child(odd) { /*(odd) or (2n 1)*/
background: #FFF;
}

Answer 1

尝试让hover选择器跟在其他人之后：

.tableData tr:nth-child(even) { /*(even) or (2n 0)*/
background: #f1f1f1;
}
.tableData tr:nth-child(odd) { /*(odd) or (2n 1)*/
background: #FFF;
}

.tableData tr:hover {
background-color: #ffff99;
}