Question

一直在挖掘并尽我所能，我已经应用了我在问到类似问题时发现的解决方案但忽略了悬停。我错过了什么？

    <style type="text/css">
        .testTable td {
            color: white;
            width: 200px;
            background-color: #44749D;
            padding: 4px;
            text-align: center;            
        }
       .testTable td:hover {
            color: 44749D !important;
            background-color: C6D4E1 !important;
        }            
    </style>

<head>
    <title>Table Test</title>
</head>
<body>
    <table class="testTable">
        <tr>
            <td>Row 1</td>
        </tr>
        <tr>
            <td>Row 2</td>
        </tr>
        <tr>
            <td>Row 3</td>
        </tr>
    </table>
</body>
</html>

有没有＆＃34;！重要＆＃34;使用和不使用类名。 IE，td {...} vs .testTable td {...}

Answer 1

试试这个CSS。您在颜色（HEX颜色值）的开头缺少（＃）

 <style type="text/css">
        .testTable td {
            color: white;
            width: 200px;
            background-color: #44749D;
            padding: 4px;
            text-align: center;            
        }
       .testTable td:hover {
            color: #44749D !important;
            background-color: #C6D4E1 !important;
        }            
    </style>

Answer 2

在颜色之前缺少＃。喜欢背景颜色：＃44749D;

    <style type="text/css">
        .testTable td {
            color: white;
            width: 200px;
            background-color: #44749D;
            padding: 4px;
            text-align: center;            
        }
       .testTable td:hover {
            color: #44749D !important;
            background-color: #C6D4E1 !important;
        }            
    </style>

<head>
    <title>Table Test</title>
</head>
<body>
    <table class="testTable">
        <tr>
            <td>Row 1</td>
        </tr>
        <tr>
            <td>Row 2</td>
        </tr>
        <tr>
            <td>Row 3</td>
        </tr>
    </table>
</body>
</html

Answer 3

你忘记了＃color＆amp;背景颜色;

            .testTable td:hover {
                color: #44749D !important;
                background-color: #C6D4E1 !important;
            }

你现在甚至可以删除！重要，因为它现在没有多大意义。

             .testTable td:hover {
                    color: #44749D;
                    background-color: #C6D4E1;
                }

替换代码和宾果它将起作用：）

样式应用于表但td：hover被忽略

3 个答案: