CSS在鼠标悬停在其上时更改表格中特定单元格的背景颜色

Question

我有一个包含三列的表格。当我将鼠标悬停在第三列时，我希望能够仅更改第三列的格式。

我希望能够结合

td：nth-​​child（3）{background-color：#ddd;}

和

td：悬停{background-color：#ddd;}

我该怎么做？

Answer 1

为单元格指定一个类名或ID。

td[id="your id"]{...}

td[id="your id"]:hover{background-color: #ddd;}

Answer 2

我认为这就是你所追求的目标。

＆＃13;

＆＃13;

td:hover:nth-child(1) {background-color: #f5f5f5;}
td:hover:nth-child(2) {background-color: #ff0000;}
td:hover:nth-child(3) {background-color: #ddd;}

＆＃13;

<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tbody>
    <tr>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
  </tbody>
</table>

＆＃13;

＆＃13;

＆＃13;

干杯