CSS不用于表TR中的TH悬停

Question

In table I'm using this below CSS for highlight tr s and I want to use :not for th

HTML:

<table>
   <thead>
      <th></th>
      <th></th>
   </thead>
   <tbody>
     <tr>
       <td></td>
       <td></td>
     </tr>
   </tbody>
</table>

CSS:

table tr:hover  {
    background-color:#fff;
}
table th:hover  {
    background-color:none !important;
}

Answer 1

Scope the selector to the tbody , not the thead .

tbody tr:hover  {
    background-color:#fff;
}
tbody th:hover  {
    background-color:none !important;
}

HTML:

<table>
    <thead>
        <tr>
           <th></th>
           <th></th>
        </tr>
    </thead>
   <tbody>
     <tr>
       <td></td>
       <td></td>
     </tr>
   </tbody>
</table>

http://jsfiddle.net/3bpZX/1/