#MyTable tr+tr:hover {
background: #dfdfdf;
}
<table id="myTable">
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>X</td>
</tr>
<tr>
<td>3</td>
<td>4</td>
<td>X</td>
</tr>
</table>
I managed to hover row 2 and 3 but while hover on 2 and 3, how can I skip the td (X). Preferable not using jQuery selector.
Best Answer
Use the :not(), :first-child and :last-child.
Also see this example.