字体系列中的字体显示大小不同

Question

每当我在设计中选择字体时，都会出现这个常见问题（对每个设计师都很常见），

例如，我们为段落设置字体系列和字体大小，如下所示，

p {
    font-family: 'Source Sans Pro', Arial, Verdana, sans-serif;
    font-size: 13px;
}

在CSS（众所周知）中，当字体系列中的第一个字体不存在时，它会选择第二种字体，如果第二种字体不存在，则会选择第三种字体，依此类推。

问题在于 Arial比来自Sans Pro＆＃39;在13 px ， Verdana比Arial大13 px 。

看这个图像：

这是每个设计师每次想到设计字体系列时面临的问题 我希望有一些CSS方法或黑客，我们告诉浏览器采取'源Sans Pro＆＃39;在13px ，但是如果它不存在而不是以13px取Arial，而不是以12px取Arial ，如果连Arial不存在比起Verdana 11px。
例如 font-family-size：＆＃39; Source Sans Pro＆＃39; 13px，Arial 12px，Verdana 11px; （这个规则在CSS中没有，只是我的愿望）

总结：我们可以为整个字体系列（包含多个字体的字体系列）分配单个大小，现在实际上每个字体大小显示不同于其他字体的（更小或更大）在同一个字体系列中。

Answer 1

您正在寻找的是font-size-adjust属性 - 这个问题的近乎完美的解决方案。当然，浏览器支持很糟糕：它只适用于Firefox 。

以下是一个示例（在Firefox中打开）：http://jsfiddle.net/zL6vL/1/