CSS -Hintergrundfarbe verschwindet mit docType

StackOverflow https://stackoverflow.com/questions/599777

  •  11-09-2019
  •  | 
  •  

Frage

Ich versuche, Hintergrundfarben auf ein paar verschiedenen Elementen auf einer HTML -Seite festzulegen, aber wenn ich eine DocType -Deklaration anwende, werden die Farben ignoriert. Andere Stile scheinen nicht betroffen zu sein. Ich bin sicher, ich bin ein Idiot.

Es passiert auf IE7, FF3 und Chrome. Mit strikter und übergangsem HTML 4 docType. Körper- und Div -Hintergrund sind betroffen. Ein minimales Beispiel ist unten. Wenn Sie die docType -Delcaration löschen, wird es in all dem grellen Ruhm mit docType - nur mühsamem Schwarz -Weiß, gerendert.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <style>
        body{background-color:FF00FF;}
        .class1{background-color:00FFFF;}
    </style>
</head>
<body>
    <div class="class1">Some Text</div>
</body>
</html>

Übrigens - ich verwende XHTML nicht, weil ich glaube, ich habe ein Gespräch in einer Kneipe zwischen viel cleverer als mir selbst gehört, die gesagt haben, Sie sollten XML nicht deklarieren, es sei denn, die MIME -Typen sind korrekt auf Ihrem Server eingestellt. Auf meinem billigen Hosting -Konto kann ich so etwas einfach nicht einfach machen.

War es hilfreich?

Lösung

Du hast das vergessen # in den Farbwerten.

body {
    background-color: #FF00FF;
}
.class1 {
    background-color: #00FFFF;
}

Andere Tipps

Der Grund, warum die Farben ignoriert werden, ist, dass die Erklärung falsch ist. Im Quirks -Modus ist die Interpretation entspannter, und die Farben werden akzeptiert, obwohl sie falsch sind, aber im Standard -Konformationsmodus muss die Erklärung korrekt sein.

Ändern Sie FF00FF in #ff00ff und 00ffff in #00ffff.

#Ff00ff kann auch in der Kurzform #f0f und #00ffff als #0ff geschrieben werden.

In CSS können Sie Farben in RGB oder Hex definieren. Das haben Sie getan. Aber Sechskantfarben sind geschrieben wie #rrggbb. Du hast das verpasst #. Scheint wie bei der Validierung, weil ein DocType festgelegt ist, so werden solche "fast korrekten" Farbdefinitionen nicht korrekt interpretiert.

Entfernen Sie die folgende Zeile

DocType html public "-// w3c // dtd html 4.01 Transitional // en" ""http://www.w3.org

Dann wird es in Ordnung sein, aber ich weiß nicht warum.

Ihr sollte Allsoo verwendenu003Cstyle type="text/css"> OR even better, don't use inline styling!

Validieren Sie immer Ihren HTML -Code hier.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top