我的CSS font-family: Helvetica, Arial, sans-serif;
为整个页面指定了" ".看起来Verdana在某些部分被使用了.我希望能够验证这一点.
我已经尝试从浏览器复制和粘贴到Word,但它不保留字体.
有没有办法确定哪个字体实际用于一段文本?
Firebug会给我上面的字体列表[1],但是我没有看到确定使用哪种字体的方法.
事实证明正在使用错误的列表,这解决了我原来的Verdana问题.但是我仍然很好奇是否有办法识别实际的渲染字体.
Arjan.. 144
如今Chrome和Firefox都有内置的工具,但Safari需要你复制一些文本并进行调查.
在Firefox中,Page Inspector有一个字体视图:
这也会告诉您是否下载了字体.
对于Chrome,请进入DevTools的"Elements",转到"Computed"选项卡,然后一直向下滚动到"Rendered Fonts"部分:
上面的屏幕截图显示可能会显示Unicode文本的多种字体.Chrome告诉你6个glyphes("Pekka"和空格)正在使用"Arial",而一个("웃")正在使用"Apple SD Gothic Neo":
Arial - 本地文件(6个字形)
Apple SD Gothic Neo - 本地文件(1个字形)
实际的CSS定义:
font-family: Arial,"Helvetica Neue",Helvetica,sans-serif
但这些字体通常不包含许多特殊字符.由于字体信息适用于每个HTML元素,其中元素中的Unicode文本实际上可以使用多种字体,因此它也显示多种字体.如有疑问,只需双击HTML窗格中的文本即可删除您不感兴趣的文本.然后,再次选择周围的元素时,您只会看到一个选项.在这种情况下,它会告诉你两个浏览器都使用"Apple SD Gothic Neo Regular"作为"웃"字符.
不幸的是,由于浏览器支持/首选的字体类型,同一台机器上的不同浏览器(甚至是单个浏览器的不同版本)可能会使用不同的字体.例如,在Mac上,Safari可能更喜欢Apple Advanced Technology,而Firefox支持Microsoft OpenType(在Mac上安装Microsoft Office后可能会产生阿拉伯语问题).或者对于上面屏幕截图中的"웃"字符,我的Mac上的Chrome和Firefox现在更喜欢"Apple SD Gothic Neo"(OpenType PostScript),但旧版本的Firefox使用"AppleGothic Regular"代替(这是一种TrueType字体) .
对于没有类似字体视图的浏览器,只需将文本片段复制并粘贴到某个文字处理器或富文本编辑器中,选择一些特定文本,然后查看某些字体下拉列表中显示的名称.在我的Mac上,当从Firefox粘贴时,这不起作用("웃"Firefox的"Apple SD Gothic Neo"在粘贴时转换为"AppleMyungjo"),但适用于Safari和Chrome:
如今Chrome和Firefox都有内置的工具,但Safari需要你复制一些文本并进行调查.
在Firefox中,Page Inspector有一个字体视图:
这也会告诉您是否下载了字体.
对于Chrome,请进入DevTools的"Elements",转到"Computed"选项卡,然后一直向下滚动到"Rendered Fonts"部分:
上面的屏幕截图显示可能会显示Unicode文本的多种字体.Chrome告诉你6个glyphes("Pekka"和空格)正在使用"Arial",而一个("웃")正在使用"Apple SD Gothic Neo":
Arial - 本地文件(6个字形)
Apple SD Gothic Neo - 本地文件(1个字形)
实际的CSS定义:
font-family: Arial,"Helvetica Neue",Helvetica,sans-serif
但这些字体通常不包含许多特殊字符.由于字体信息适用于每个HTML元素,其中元素中的Unicode文本实际上可以使用多种字体,因此它也显示多种字体.如有疑问,只需双击HTML窗格中的文本即可删除您不感兴趣的文本.然后,再次选择周围的元素时,您只会看到一个选项.在这种情况下,它会告诉你两个浏览器都使用"Apple SD Gothic Neo Regular"作为"웃"字符.
不幸的是,由于浏览器支持/首选的字体类型,同一台机器上的不同浏览器(甚至是单个浏览器的不同版本)可能会使用不同的字体.例如,在Mac上,Safari可能更喜欢Apple Advanced Technology,而Firefox支持Microsoft OpenType(在Mac上安装Microsoft Office后可能会产生阿拉伯语问题).或者对于上面屏幕截图中的"웃"字符,我的Mac上的Chrome和Firefox现在更喜欢"Apple SD Gothic Neo"(OpenType PostScript),但旧版本的Firefox使用"AppleGothic Regular"代替(这是一种TrueType字体) .
对于没有类似字体视图的浏览器,只需将文本片段复制并粘贴到某个文字处理器或富文本编辑器中,选择一些特定文本,然后查看某些字体下拉列表中显示的名称.在我的Mac上,当从Firefox粘贴时,这不起作用("웃"Firefox的"Apple SD Gothic Neo"在粘贴时转换为"AppleMyungjo"),但适用于Safari和Chrome:
根据Wilfred Hughes的回答,Firefox现在支持这种做法.本文有更多细节.
这个答案原始引用了"Font Finder"插件,但仅仅因为它来自4年前.旧答案如此流传,社区无法更新这一事实是Stack Overflow为数不多的失败之一.
Firefox 22+将显示当前正在使用的字体,没有任何扩展名.
WhatFont是Chrome扩展程序,它将具体告诉您正在加载字体堆栈中的哪种字体.
对于当前版本的Firefox(自v7起),有一个名为"fontinfo"的附加组件,它将报告所使用的实际字体(而不是CSS font-family属性所说的内容),同时考虑到浏览器回退到的情况.不同的字体,因为请求的字体系列不可用或不支持文本中使用的字符.