CSS 字体系列在 Windows 和 Mac OS X 上的显示方式不同

发布于 2024-11-26 23:44:54 字数 272 浏览 5 评论 0原文

由于某种原因，以下两个代码片段在 Mac OS X 上显示正确，但在 Windows 上完全被忽略，即字体恢复为具有默认大小和边距的 Times New Roman。知道为什么会这样吗？

body {
    font-family: "Helvetica Neue", "Lucida Grande", "Sans serif";
}

#div h1, p {
    margin: 0px;
    font-size: 14px;
    color: #333;
}

原文

For some reason, the following two code snippets display correctly on Mac OS X but are completely ignored on a Windows i.e. the font reverts to Times New Roman with default sizes and margins. Any idea why this could be?

body {
    font-family: "Helvetica Neue", "Lucida Grande", "Sans serif";
}

#div h1, p {
    margin: 0px;
    font-size: 14px;
    color: #333;
}

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

多谢你的绝情让我学会死心 2024-12-03 23:44:54

它是带有破折号的无衬线字体。前两种字体可能没有安装在 Windows PC 上（我没有）。

回复收藏 0 原文

鸵鸟症 2024-12-03 23:44:54

尝试这样的事情：

font-family: "Helvetica Neue", "Lucida Grande", Helvetica, Arial, sans-serif;

try something like this:

font-family: "Helvetica Neue", "Lucida Grande", Helvetica, Arial, sans-serif;

回复收藏 0 原文

偷得浮生 2024-12-03 23:44:54

根据 font-family 属性，计算机尝试查找 Helvetica Neue、Lucida Grande 和 Sans serif 字体。

但是，PC 没有安装 Helvetica Neue 或 Lucida Grande 字体，并且无法找到后备字体 Sans serif，因为浏览器默认为 sans-serif ，一个词，不带引号。

建议您尝试添加更多可在 Windows 计算机上找到的无衬线字体，例如 Lucida Sans，这样它看起来就不会像糟糕的默认无衬线字体 Arial。

您的边距和字体大小应该可以再次使用，但我建议您将 font-size: 14px; 更改为 font-size: 1em; 或 font-size: 100%; 以允许用户在不破坏布局的情况下缩放字体。

这是你的修复方法：

body {
    font-family: "Helvetica Neue", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", sans-serif;
}

#div h1, p {
    margin: 0;
    font-size: 1em;
    color: #333;
}

According to the font-family attribute, the computer's trying to find the fonts Helvetica Neue, Lucida Grande, and Sans serif.

However, the PC doesn't have the fonts Helvetica Neue or Lucida Grande installed, and it can't find the fallback font Sans serif because the browser default is sans-serif, one word, with no quotation marks.

As a suggestion, you should try adding more sans-serif fonts that can be found on Windows machines, such as Lucida Sans so it doesn't look like the terrible default sans-serif font Arial.

Your margins and font sizes should work again, though I suggest that you change font-size: 14px; to font-size: 1em; or font-size: 100%; to allow users to scale the font without destroying the layout.

Here's your fix:

body {
    font-family: "Helvetica Neue", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", sans-serif;
}

#div h1, p {
    margin: 0;
    font-size: 1em;
    color: #333;
}

回复收藏 0 原文

~没有更多了~