css - 使用 tr :hover in CSS

Question

只是在 Wordpress 网站上工作并对 style.css 进行一些更改以影响网站内的表格。

这是“lassa”类的表，我所做的编辑是:

table.lassa {
border-width: 1px;
border-color: #99cc00;
border-collapse: collapse;
}
table.lassa th {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #99cc00;
background-color: #dedede;
}
table.lassa td {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #99cc00;
background-color: #ffffff;
}

table.lassa tr:hover {
background-color: Green;
}

...一切正常 - 除了 tr:hover 位

它甚至没有那么重要，但我想知道我哪里出错了。我是一个 SEO 人，而不是 out & out code junkie，所以总是想知道为什么有些东西没有像我预期的那样做! :)

谢谢!

Answer 1

因为背景色在 'td' 而不是 'tr' 上，'tr' 元素实际上位于 'td' 元素后面，所以如果设置了 'td'，你将永远看不到它的背景色，更改到下面:

table.lassa tr:hover td{
  background-color: Green;
}