css - 如果字体存在，CSS 能否设置适当的属性？

Question

我想在我的网络应用程序中使用不同的字体。由于它们的大小不相等，我想在 CSS 中做一些像这样的伪代码:

if (exists(font1))
{
   font-size: 9pt; font-family: font1;
}
else
{
   font-size: 12pt; font-family: font2;
}

这可能吗？最好和正确的解决方案是什么？如何为某种字体定义字体大小并为下一种字体定义另一种字体大小？

Answer 1

CSS 通常没有条件或其他动态结构。

您的问题已通过使用所谓的“字体堆栈”得到解决。您使用逗号分隔的字体名称列表声明 font-family。客户端浏览器现在从他可用的列表中选择字体。这就是为什么创建好的字体堆栈是一项棘手的任务(因为它们应该看起来相似或者至少具有相似的字母间距/行高)。如果您在 google 上搜索 Web 字体堆栈，您会从专业的字体专家那里获得一些关于该主题的好文章，他们已经为您创建了漂亮的字体堆栈。

现在的替代方法是通过 @font-face 声明提供您想要的字体作为可下载字体。但是请记住:

• 你需要多种格式来支持所有浏览器
• 它们为可能与移动设备相关的页面加载增加了额外的权重
• 您需要使用该字体或使用免费字体的权利(Google 提供了一项服务，您可以从中挑选各种免费字体)