trの親を持つ各tdの背景を変更する

Question

.GMDataRow td:hoverそのtr要素の各tdの背景色を変更したい。これはCSSでのみ可能ですか？私はCSSだけでそれをやろうとしています。私はJQuery、JSソリューションは必要ありません。

<tr class="GMDataRow"> 
<td></td> 
<td</td> 
... 
</tr> 

Answer 1

Laljiによって提案

tr.GMDataRow:hover td{background:#ccc;} 

Answer 2

ソリューションが最適です。この方法を試してみてください。

tr.GMDataRow:hover td{ 
     background-color:red; 
} 

• tr.GMDataRowは、テーブルの行でクラス "GMDataRow" を見つけました。
• tr.GMDataRow：ホバーは現在のターゲット行のホバーcssをアクティブにします。
• tr.GMDataRow：ホバーtdは、アクティブな行の子であるすべての列をターゲットにします。

Answer 3

あなたは違ったホバー上のTDの背景を変更したい場合は...この

HTML

<table style="width:100%"> 

    <tr class="GMDataRow"> 

     <td>ceva</td> 

     <td>ceva</td> 

     <td>ceva</td> 

     <td>ceva</td> 

    </tr> 

</table> 

CSS

.GMDataRow td:first-child:hover { 
    background: yellow; 
} 

.GMDataRow td:nth-child(2):hover { 
    background: pink; 
} 

.GMDataRow td:nth-child(3):hover { 
    background: red; 
} 

.GMDataRow td:last-child:hover { 
    background: blue; 
} 

を試みるも、ここhttp://www.w3schools.com/css/css_pseudo_classes.asp、またはここを見てhttp://www.w3schools.com/cssref/sel_firstchild.aspそれはあなたがよりよく理解するのに役立つかもしれません。