在行悬停时将CSS样式应用于第一个表格单元格

Question

我有一个表格行，其中包含两个单元格。当我悬停在该行上时，如何使只有第一个单元格的背景色更改？

#formTable tr:hover {
   background:red; // only want the first cell to change...
                   // ...this will do the whole row
}

- Jon

---

你应该将你的解决方案发布为一个答案，然后接受它。 - James Montagne

Answer 1

这应该可以正常工作：

#formTable tr:hover td:first-child {
   background:red;
}

:first-child: https://developer.mozilla.org/zh-CN/docs/Web/CSS/:first-child

- Kevin Boucher

Answer 2

这只会改变第一行的第一个单元格：

#formTable tr:first-child:hover td:first-child{
    background-color: red;
}

这将改变任何行的第一个单元格：

#formTable tr:hover td:first-child{
    background-color: red;
}

- w3jimmy