css - 行ホバーの最初のテーブルセルにCSSスタイルを適用する

Question

2つのセルを持つテーブル行があります。行にカーソルを合わせると、最初のテーブルセルの背景だけが色を変えるようにするにはどうすればよいですか？

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

Answer 1

これは機能するはずです：

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

：first-child：https ://developer.mozilla.org/en-US/docs/CSS/:first-child

Answer 2

これにより、最初の行の最初のセルのみが変更されます。

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

これにより、任意の行の最初のセルが変更されます。

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