css背景颜色随doctype消失答案

【问题标题】：css background color disappears with doctypecss背景颜色随doctype消失
【发布时间】：2009-03-01 13:00:49
【问题描述】：

我正在尝试在 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 类型。在我的便宜主机帐户上，我不能轻易做到这一点。

【问题讨论】：

标签： html css doctype strict

【解决方案1】：

您忘记了颜色值中的#。

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

【讨论】：

天才！（你不是我！）。谢谢。

【解决方案2】：

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

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

#FF00FF 也可以简写为#F0F，#00FFFF 也可以写为#0FF。

【讨论】：

【解决方案3】：

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

【讨论】：

【解决方案4】：

删除以下行

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

那会没事的，但我不知道为什么。

【讨论】：

【解决方案5】：

你应该使用

始终验证您的 html 代码 here。

【讨论】：

那只是为了这个最小的例子，它是真实的外部样式表。