html - css背景颜色随doctype消失

Question

我正在尝试在 html 页面中的几个不同元素上设置背景颜色，但是每当我应用 doctype 声明时，颜色都会被忽略。其他风格似乎不受影响。我确定我是个白痴。

它发生在 IE7、FF3 和 Chrome 上。使用严格和过渡的 html 4 Doctype。Body 和 Div 背景会受到影响。下面是一个最小的示例。如果您删除 Doctype 声明，它会呈现出它所有的花哨荣耀，只有 doctype - 单调乏味的黑白。

<!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>

顺便说一句 - 我没有使用 XHTML，因为我想我曾经在酒吧里听到比我聪明得多的人之间的对话，他们说你不应该声明 XML，除非你的服务器上正确设置了 mime 类型。在我的便宜主机帐户上，我不能轻易地做那种事情。

score 8 · Accepted Answer

您忘记了#颜色值。

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

score 6 · Accepted Answer

忽略颜色的原因是声明不正确。在 quirks 模式下，解释更加宽松，即使颜色不正确，也可以接受，但在标准兼容模式下，声明必须正确。

将 FF00FF 更改为 #FF00FF，将 00FFFF 更改为 #00FFFF。

#FF00FF 也可以写成#F0F 的缩写，#00FFFF 写成#0FF。

score 1 · Accepted Answer

在 CSS 中，您可以在 RGB 或 Hex 中定义颜色。这就是你所做的。但是 Hex-Colors 写成#rrggbb. 你错过了#。似乎在进行验证时，因为设置了文档类型，因此无法正确解释这种“几乎正确”的颜色定义。

score 1 · Accepted Answer

删除以下行

DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 过渡//EN" " http://www.w3.org

然后就好了，但我不知道为什么。

score 0 · Accepted Answer

你应该使用 <style type="text/css"> 或者更好，不要使用内联样式！

始终在此处验证您的 html 代码。

html - css背景颜色随doctype消失

5 回答 5

Related

Reference