你没有设置背景颜色（或背景颜色被设置为透明），但你设置了文字颜色。

Question

我收到了这个警告（这不是一个错误，我的CSS是有效的）。

我选择了完整报告来验证检查。

你没有设置背景颜色（或将背景颜色设置为透明），但你已经设置了颜色。确保颜色的级联使文本看起来合理可读。

这是什么意思以及如何解决。我在57个选择器中都得到了这个。

- Jitendra Vyas

Answer 1

非常好的解释，@graphicdevine 解释了为什么会有这些警告。

与其硬编码

background-color: #xxx;

针对每个标签，我在一个论坛上看到建议加入以下内容：

background-color: inherit;

此外，无论您在哪里设置背景颜色但未设置文本颜色，请添加以下内容：

color: inherit;

它为我解决了所有这些类型的警告。

- Curtis

Answer 2

这涉及到当字体颜色与背景颜色相同时的理论问题，即：

background-color: #fff;
color: #fff;

你不需要太担心这个问题，但是如果你想消除警告信息，我猜只需要按照信息设置背景颜色即可。

- Piotr Rochala

---

这是一个真正的问题。它最常出现在作者假设人们将默认主背景颜色设置为白色时，但它也可能与用户样式表冲突。 - Quentin

好问题。那么元素内部的背景颜色呢？如果您在其中设置了CSS颜色属性，那么每个 div 都需要一个背景吗..？ - Piotr Rochala

你不知道用户配置了什么浏览器。他们可能会有 p { background: white; color: black }。一般来说，如果可以的话，总是同时指定两个。 - Quentin

那么 * { background-color:#fff; color:#000; } 可能会解决问题？在第一行声明它，然后按照以下规则进行覆盖。 - Piotr Rochala

不，这样做没有任何帮助。级联很重要。在级联的最不具体的部分应用背景颜色对元素的影响很小。 - Quentin

不起作用：警告：'“background-color”和“color”颜色相同。 - João Pimentel Ferreira

Answer 3

将 background-color:#/*whatever you want*/; 添加到所有 57 个选择器中，你的问题就会解决。

- Kyle

---

“html { color: #000; background: #FFF; min-height: 100%; margin-bottom: 1px; font-size: 100%; }”已经作为我的CSS文件中的第一项定义了。尽管如此，我仍然收到这个警告。 - Jitendra Vyas

一个“重启”是没有用的。 - Quentin

好的，那么只需将该规则添加到您的其他选择器中即可。 - Kyle

Answer 4

你可以这样解决：

确保颜色层叠时文本仍然清晰可读。

这是一个警告，提醒可能存在问题，但没有工具能够判断是否真的存在问题。

当然，“清晰可读”是非常主观的。我使用颜色对比度分析器，还有许多类似的工具可供选择。

- graphicdivine