html - 覆盖表格行样式

Question

我的 CSS 文件中有：

.my_table tr {
    background:#BBBBBB;
}

和

.my_table tr .hover_style {
    background:#AAAAAA;
}

在我的 HTML 中，我的表的所有行都带有 hover_style：

<table class='my_table'>
    <tr class='hover_style'>
    ...
    </tr>
</table>

但所有行都有#BBBBBB颜色，但我预计会覆盖颜色#AAAAAA；

我哪里错了？

Answer 1

你的悬停风格有一个空间。

.my_table tr.hover_style {
    background:#AAAAAA;
}

编辑：如果您在选择器之后有一个空格，它将为所有定义了 hover_style 的后代设置样式。在这种情况下，您所说的是“样式化所有具有类 hover_style 的 my_table 表行后代”。您想要的是没有空格，它将为 .my_table 下具有类名 hover_style 的所有 td 行设置样式。