调整字体大小取决于从字体堆栈中使用哪种字体

我在网站上为某个标题使用了新的Google API字体之一。它是Yannone Kaffeesatz，是一个相当浓缩的字体。调整字体大小取决于从字体堆栈中使用哪种字体

我的字体堆栈如下：

font-family: 'Yanone Kaffeesatz', arial, serif;

这是正常时，Yannone Kaffeesatz字体渲染，但如果没有，宋体是更加开放和标题跨越两行。

我的问题是：

是否有可能使用不同的字体大小，这取决于字体在页面上呈现的？

理想地支持跨多种浏览器。

感谢

汤姆

来源

2010-11-07 Tom Dickie

这是一个骗局，但我找不到原始的 – 2010-11-07 16:56:10

您可以添加基于服务器的用户代理检测，然后服务于不同的页面（或只是css）。 IMO这是唯一稍微优雅的解决方案。谷歌有一个浏览器和版本的列表，保证工作。如果它大部分是静态文本，你可以使用PNG。 – 2010-11-07 17:29:01

原始副本可能是这样的：[使用jQuery改变基于字体家族的字体大小]（http://stackoverflow.com/questions/1271477/changing-body-font-size-based-on-font-家庭与jQuery） – Lode 2011-06-17 07:38:07

不，这是不可能的。即使在JavaScript中，从font-family列表中找出实际使用的字体也很复杂而且很难 - 纯CSS中不可能。

如果你想要去JavaScript路线，here是一个聪明的方法来检测JavaScript中的实际字体家族的链接。

知道使用的字体后，很容易将element.style.letterSpacing调整为所需的数量。

来源

2010-11-07 16:56:40

感谢您的回应。我有这样的感觉。我可能不得不重新考虑我的筹码。我可能会做一些溢出或可能让它正常运行多行。 – 2010-11-07 16:58:52

根据字体略微更改字体大小的一个属性是。它是CSS3，只有Firefox支持。

但我不认为你想调整长宽比和宽高比，使Arial变窄。挤压字体（例如字母间距）变得很难看。相反，您应该从堆栈中使用更浓缩的字体开始。

http://pieroxy.net/blog/2014/10/11/the_quest_for_a_condensed_web_font.html详细研究浓缩字体选项。其中一个棘手的发现是font-stretch: condensed，例如，有助于访问Arial缩小在Windows（与办公室）。

来源

2015-03-16 14:50:04

调整字体大小取决于从字体堆栈中使用哪种字体

回答

相关问题