为什么当行中的单元格具有类名时,为什么CSS悬停在表行上工作?

前端之家收集整理的这篇文章主要介绍了为什么当行中的单元格具有类名时,为什么CSS悬停在表行上工作?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有这样的困难,所以任何帮助将不胜感激。我有一个表有几行。行内的每个单元格都属于某一类。我使用这些类名来对单元格进行着色。

这是我表中的一个例子:

<tr>
     <td class = "summarypage-odd-column">Theme</td>    <td class = "summarypage-odd-column">Q2 2009</td>   <td class = "summarypage-odd-column">Q1 2009</td>
     <td class = "summarypage-even-column">Theme</td>   <td class = "summarypage-even-column">Q2 2009</td>  <td class = "summarypage-even-column">Q1 2009</td>
     <td class = "summarypage-odd-column">Business Area</td>    <td class = "summarypage-odd-column">Q1 2009</td>   <td class = "summarypage-odd-column">Q1 2008</td>
 </tr>

用户将鼠标指针移动到该行中的任何单元格时,我想强调每一行。所以我使用以下CSS代码实现。

tr:hover {
  background-color: #FFFAF0; color: #000;
}

不幸的是,因为每个表的数据单元格都有一个类名,所以悬停不起作用。但是,如果我从数据单元格中删除类名,则悬停起作用。

我的问题是有什么办法可以让表格行的悬停状态,同时仍然有行数据单元格的类名。

谢谢

解决方法

尝试这个:
tr:hover td {
  background-color: #FFFAF0; color: #000;
}

将现有的td样式声明放在一起是安全的

猜你在找的CSS相关文章