如何判断Chrome使用的是哪种字体？
Lia*_*rch 68 css fonts google-chrome
想象一下,我有以下CSS
font-family: 'Non-existant Sans', Arial, sans-serif;
假设系统上未安装"不存在的Sans",浏览器将使用Arial.使用Chrome,有没有办法找出正在呈现的字体？
编辑:戴夫(在问题的评论中)指出了一个类似的问题.我在这里专门询问Chrome.然而,另一个问题中的许多答案都表明扩展是可以的; 是否存在使用Dev Tools单独确定此信息的本地方法？
编辑2013年9月: Chrome团队刚刚宣布,Chrome Canary的最新版本中提供了字体系列检查(Twitter链接包含更多信息的图像).这应该会在未来几周内通过dev> beta>稳定下来 - 好消息!
Jür*_*aul 91
在"元素"标签中的Google Chrome开发工具栏中,在"已计算"下:
- 在Chrome 34.0.1847.116中,渲染字体在底部的"计算"选项卡中一直列出.该部分称为"渲染字体".此外,您必须选择具有文本的特定元素,否则它将不会显示. (21认同)
- @agad(以及未来的读者)这些数字告诉你当前文本的字形有多少来自字体堆栈中的每种字体.'字形'是表示给定字符的特定可见符号(因此,如果您在三种不同的字体中使用字母'B',它们都是相同的字符,但它们使用三种不同的字形.)字体后退是按每个字符计算的 - 字符基础,因此如果默认字体没有当前字符的字形,它将在每个连续的后备字体中查找一个字形.这意味着给定的文本元素可以偷偷地使用多个字体的字形. (3认同)
我参加派对有点晚了,但我刚刚发现了一种调试浏览器使用的字体的简单方法.
在Chrome Web Inspector中,转到"元素"面板的"CSS"面板中的字体堆栈.然后,从堆栈顶部开始,更改字体名称(我添加随机字母),同时密切关注相关文本.当您更改正在使用的文本时,您会看到文本更改字体,因为它会回退到堆栈中的下一个字体.
我假设在大多数开发工具中都有类似的东西
瞧
您的“不存在的 Sans”可以在 css 中使用 @font-face 进行渲染。 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。
| 归档时间： |
|
| 查看次数： |
22746 次 |
| 最近记录： |