表格td上的CSS背景颜色在Internet Explorer 6中显示不正确

Joh*_*uff 1 html css html-table background-color internet-explorer-6

我有一些非常简单的HTML和CSS在Internet Explorer 6中不起作用.

<!DOCTYPE HTML>
<html>
    <head>
        <style>        
            table td.one.read {background-color:#FFD700;}
            table td.two.read {background-color:#0000ff;}
            table td.three.read {background-color:#ff8c00;}
        </style>
    </head>

    <body>
        <table>
            <tr class="head">
                <td></td>
                <td class='one read'>one</td>
                <td class='two read'>two</td>
                <td class='three read'>three</td>
            </tr>

            <tr>
                <td>Legend</td>
                <td class='one read'>1</td>
                <td class='two read'>2</td>
                <td class='three read'>3</td>
            </tr>
        </table>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

一个简单的表,每列具有不同的背景颜色.我删除了一堆其他的CSS/HTML以保持简单.问题是所有列在Internet Explorer 6中显示为相同的橙色,在Firefox中工作正常.

我怎样才能使它工作?

SLa*_*aks 5

这是IE6中的一个错误.

如果你有一个带有多个类名的CSS选择器(例如.three.read),IE6将忽略除最后一个之外的所有类名.

因此,IE6看到了选择器的三个CSS规则table td.read.

要解决此问题,您可以组合您的类.(例如,<td class='OneRead'>table td.OneRead {background-color:#FFD700;})