我如何知道Chrome正在使用哪种字体？

想象一下，我有以下的CSS

font-family: 'Non-existant Sans', Arial, sans-serif; 

假设系统中没有安装“不存在的Sans”，Arial将被浏览器使用。 使用Chrome，有什么方法可以找出哪个字体被渲染？

编辑：戴夫（在对这个问题的意见）指出了一个类似的问题。 我在这里专门询问了Chrome。 在另一个问题的许多答案表明扩展是可以的，但是; 有没有一种独自使用开发工具来确定这些信息的方法？

编辑2013年9月： Chrome团队刚刚宣布，现在可以在Chrome Canary的最新版本中使用字体系列检测（Twitter链接包含更多信息的图像）。 这将在接下来的几周内通过dev> beta>稳定下来 – 好消息！

Answer 1

在“元素”标签中的“计算”下的Google Chrome开发工具中：

Answer 2

我晚了一点，但我刚刚发现了一个非常简单的方法来debugging您的浏览器正在使用的字体。

在Chrome Web Inspector中，转到Elements面板的CSS窗格中的字体堆栈。 然后，从堆栈的顶部开始，改变字体的名称（我添加了随机字母），同时关注所讨论的文本。 当你改变正在使用的那个，你会看到文本改变字体，因为它回落到堆栈中的下一个。

我认为大多数开发工具都有类似的可能性

瞧

Answer 3

如果你不想使用一个插件，有一个小书签会告诉你这个（一旦被激活，你就可以hover在上面的文字上）：

http://chengyinliu.com/whatfont.html

Answer 4

你的'不存在的Sans'可以用@ font-face在你的css中呈现。 http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp

我不知道一种检测字体渲染的方法，所以我没有从技术上回答你的问题。 我确实发现这个： http : //webdesignerwall.com/tutorials/css3-font-face-design-guide它是一个名为Modernizr的JavaScript，确保浏览器不支持@ font-face，那么它将加载后备字体，如Arial和Helvetica。