当鼠标悬停在特定表格单元格的行上时，如何更改其颜色？

Question

我试图让我的表数据在悬停在表行上时改变颜色。那可能吗？我尝试到处搜索，但似乎没有一个符合我的描述。

我只想当我将鼠标悬停在表格行上时更改“Hello World”的颜色。因此，当我将鼠标悬停在表行中的任何位置时，只有表数据“Hello World”会改变颜色。

table tr:hover {
  color: white
}

<table>
  <tbody>
    <tr>
      <td> Hello World </td>
      <td> Greetings </td>
    </tr>
  </tbody>
</table>

Answer 1

如果您只想在将鼠标悬停在表行的任何部分上时更改特定单元格，请为该单元格指定一个类并在选择器中使用它：

table tr:hover td.change{
  color: white
}

<table>
  <tbody>
    <tr>
      <td class="change"> Hello World </td>
      <td> Greetings </td>
    </tr>
  </tbody>
</table>