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中工作正常.
我怎样才能使它工作?
这是IE6中的一个错误.
如果你有一个带有多个类名的CSS选择器(例如.three.read),IE6将忽略除最后一个之外的所有类名.
因此,IE6看到了选择器的三个CSS规则table td.read.
要解决此问题,您可以组合您的类.(例如,<td class='OneRead'>和table td.OneRead {background-color:#FFD700;})