来自同一表格的不同单元格的探针在悬停时更改不同的背景颜色

时间:2016-07-17 21:55:35

标签: html css

我一直试图在同一个表格中找到不同单元格的简单示例,这些单元格的背景颜色彼此不同。我读过你可以为各个TD分配类或ID,所以我设置我的代码并没有成功。

<html>
<head>
    <style>
        .aTD td:hover {background-color: green;}
        .bTD td:hover {background-color: yellow;}
        .cTD td:hover {background-color: red;}

    </style>
</head>
<body>
    <table style="width:95%; height:95%;" >
        <td class="aTD"><a href="#setA">A</a></td>
        <td class="bTD"><a href="#setB">B</a></td>
        <td class="cTD"><a href="#setC">C</a></td>
    </table>
</body>

如果我用...替换样式脚本

td:hover{background-color:red;}

然后它有效,但我试图为不同的细胞获得不同的颜色。我在这里想念的是什么看起来很简单。

1 个答案:

答案 0 :(得分:0)

当您为每个TD标记分配类时,无需提及TD。

<style>
    .aTD:hover {background-color: green;}
    .bTD:hover {background-color: yellow;}
    .cTD:hover {background-color: red;}
</style>