假设有一个示例表：
<table>
<tr>
<th>Head 1</th>
<th>Head 2</th>
</tr>
<tr>
<td>Data 1</td>
<td>Data 2</td>
</tr>
<tr>
<td>Data 3</td>
<td>Data 4</td>
</tr>
<tr>
<td>Data 5</td>
<td>Data 6</td>
</tr>
<tr>
<td>Data 7</td>
<td>Data 8</td>
</tr>
</table>
我正在寻找突出显示<= n行的最佳技术，其中n是悬停的行（不包括标题行）。例如，如果鼠标移到
<tr>
<td>Data 5</td>
<td>Data 6</td>
</tr>
该表的以下部分应突出显示：
<tr>
<td>Data 1</td>
<td>Data 2</td>
</tr>
<tr>
<td>Data 3</td>
<td>Data 4</td>
</tr>
<tr>
<td>Data 5</td>
<td>Data 6</td>
</tr>
有什么想法可以达到这种效果吗？
基本上，您会看到相反的结果：tr悬停后的tr任何背景都应该没有背景：测试此：
table:hover tr {
background:gray;
}
table:hover tr:hover ~tr {
background:none;
}
==============编辑自请求中的注释================
注意：此选项不允许单击单元格，但每行的最后一个。
table {
pointer-events:none;
}
table tr :last-child {
pointer-events:auto;
cursor: pointer;
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句