html - 奇数のテーブル行が強調表示されない

Question

すべての奇数行を強調表示するテーブルがあります。

これを行うには、行番号を確認し、その行にaltクラスを適用します。

:hover次に、CSSファイルのシンプルを使用してホバーで行を強調表示します。

.alt非行は完全に強調表示されますが、行は強調表示されませんalt。

これが私のCSSコードです：

.datagrid tr:hover, .datagrid tr.alt:hover {
    background-color:#497A43;
    color:#D3F0D4;
}

私は何が間違っているのですか？

score 2 · Accepted Answer

それらの面倒なクラス変更メソッドを適用しないでください。代わりにcssセレクターを使用してください

.datagrid tr:nth-child(even):hover {background: #CCC}
.datagrid tr:nth-child(odd):hover {background: #FFF}

score 0 · Accepted Answer

.altセレクターがなくても動作します。

score 0 · Accepted Answer

それ以外の

.datagrid tr:hover, .datagrid tr.alt:hover 

{


    background-color:#497A43;


    color:#D3F0D4;


}

以下を使用してください

.datagrid tr.alt:hover 

{

    background-color:#497A43;

    color:#D3F0D4;


}

上記は、「alt」としてクラスを持つ行に、ホバーされた場合にのみ、背景色と色を適用します。

これがお役に立てば幸いです。

3 に答える 3