小编She*_*hai的帖子

我想做与此示例完全相同的事情： http: //jsfiddle.net/ThinkingStiff/rUhCa/。

但是，当我尝试更改表格的背景颜色时，悬停和突出显示停止工作。

下面你可以看到我的代码：

超文本标记语言

<table>
    <tr>
        <th></th>
        <th class="col">50kg</th>
        <th class="col">55kg</th>
        <th class="col">60kg</th>
    </tr>
    <tr>
        <th class="row">160cm</th>
        <td>20</td>
        <td>21</td>
        <td>23</td>
    </tr>
</table>

CSS

table {
   border-spacing: 0;
   border-collapse: collapse;
   overflow: hidden;
   z-index: 1;
}

td, th, .row, .col {
   cursor: pointer;
   padding: 10px;
   position: relative;
}

td:hover::before,
.row:hover::before { 
   background-color: #ffa;
   content: '\00a0';  
   height: 100%;
   left: -5000px;
   position: absolute;  
   top: 0;
   width: 10000px;   
   z-index: -1;        
}

td:hover::after,
.col:hover::after { 
   background-color: #ffa;
   content: '\00a0';  
   height: 10000px;    
   left: 0; …