CSS background-color auf dem Tisch td falsch in Internet Explorer 6 Anzeigen
-
19-09-2019 - |
Frage
Ich habe einige ziemlich einfache HTML und CSS, die nicht in Internet Explorer 6 nicht funktioniert.
<!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>
Eine einfache Tabelle, die unterschiedlichen Hintergrundfarben für jede Spalte hat. Ich habe eine Reihe von anderen CSS / HTML entfernt Dinge einfach zu halten. Das Problem ist, alle Spalten zeigen, wie die gleiche orange Farbe in Internet Explorer 6, arbeitet in Firefox .
Wie kann ich es?
Lösung
Dies ist ein Fehler im IE6.
Wenn Sie einen CSS-Selektor mit mehreren Klassennamen haben (zB .three.read
), IE6 werden alle Klassennamen mit Ausnahme des letzten ignorieren.
Daher IE6 sieht drei CSS-Regeln für den Wähler table td.read
.
Um dies zu lösen, können Sie Ihre Klassen kombinieren. (ZB <td class='OneRead'>
und table td.OneRead {background-color:#FFD700;}
)
Andere Tipps
Mehrere Klassen werden nicht in IE6 unterstützt, müssen noch ein paar Jahre warten, bevor IE6 stirbt. obwohl jetzt können Sie separate Klassen für Farben erstellen.