html - 为什么某些 CSS 规则仅适用于 Chrome？

Question

请在 Chrome 中访问此页面并查看Aktualności和文本部分：

Tupacsum Ipsum 她几乎献出了自己的生命......

然后在 Firefox 和 Opera 上查看相同的 URL。接下来尝试向我解释为什么这条规则：font: 12px normal 'Lato', 'Times New Roman';在（FF、Opera）和 Chrome 上都不起作用。

我在某个地方犯了错误吗？还是我使用了只能在 Chrome 上使用的东西？

铬合金：

铬合金

在此处输入图像描述

score 1 · Accepted Answer

你为什么不把它body #main.home > .bottom .right .top article从.desc p

.desc p {
    font-size: 12px;
    font-family: 'Lato', 'Times New Roman';
    line-height: normal;
}

在使用 LESS 时嵌套规则时要小心，你不应该真正嵌套超过 3 层。想想你将如何首先编写实际的选择器，然后只嵌套需要的内容。

score 1 · Accepted Answer

浏览器只是被通用字体属性的值弄糊涂了。您需要指定更多值，以便它了解在哪里应用什么。

这工作正常：

body #main.home > .bottom .right .top article {
    font: normal 12px/normal 'Lato', 'Times New Roman';
}

@ferne97 的解决方案虽然可能是不使用特定于选择器的更好做法，但仅在明确设置字体系列而不是使用相同的通用字体属性时才有效。如果您使用带有原始字体属性值的简化选择器，问题仍然存在。