鼠标悬停时更改 html 中的字体颜色和背景

我使用一小段内联 HTML 代码来更改鼠标悬停时表格中单元格颜色的背景。我仅在特定的表格单元格上使用此功能，因此并非所有单元格都需要这样做。

<td  bgcolor="#000000" onmouseover="this.bgColor='white'" onmouseout="this.bgColor='black'"  >

这很好用，但我还想更改字体颜色。

因此默认情况下它是带有白色文本的黑色单元格

但是当鼠标悬停时，背景颜色是白色，文本是黑色，我应该怎么做？

如果你使用的话那就太好了:hover伪类onmouseover event

td:hover
{
   background-color:white
}

对于默认样式只需使用

td
{
  background-color:black
}

因为你想使用这些样式而不是所有td元素，那么您需要为这些元素指定类，并向该类添加样式，如下所示

.customTD
{
   background-color:black
}
.customTD:hover
{
  background-color:white;
}

您还可以使用:nth-child选择器来选择 td 元素