如果您曾经完全被网站上看到的字体所吸引，那么您可能想知道如何发现它的名称，以便可以在自己的内容中使用它。 高质量的字体可以改善访问者的阅读体验，因此可能值得尝试一下。 不管您检查网站上使用哪种字体的原因，都有许多可以帮助您的工具。
在本文中，我们将讨论为什么您可能想要查看网站使用的字体。 我们还将向您展示如何操作。
让我们开始吧！
为什么您可能要检查网站使用的字体
就像我们已经提到的那样，精美易读的字体可以改善您网站的用户体验（UX）和可读性。 它还可以确保访问者可以舒适地与您的内容互动，而不会费力地解密它。 如果您的文字时尚但难以辨认，读者会发现很难理解或欣赏您的资料。
如果它们的文字不可读，那么号召性用语（CTA）按钮也可能几乎全部无效。 这就是为什么您可能会方便地保留一些字体列表的原因，因为它们既是 时尚而清晰。 然后，您可以在您的网站上使用它们，也可以将来将其用于客户。
如何查看网站使用的字体（3种可用方法）
您可以使用多种方法来检查网站使用的字体。 浏览器的检查功能是一个很好的入门解决方案，但是有些扩展可以产生同等的效果。 您甚至可以使用在线工具从图像中找到字体。 让我们看一下每个选项。
1.使用浏览器检查器工具识别字体
检查网站使用哪种字体的最简单方法之一是使用浏览器的检查器工具。 尽管在此示例中我们将使用Chrome Inspector，但值得注意的是其他浏览器也具有相同的功能。
首先，右键单击包含您要查找的字体的网页。 从出现的菜单中，选择“检查”：
如果您想使用键盘快捷键，请在Windows或Linux上尝试按Ctrl + Shift + I。 如果您使用的是Mac，则等效为Cmd + Shift + I。
在屏幕右侧的窗口中，使用您要签出的字体查找文本。 当您选择相应的HTML元素时，它将突出显示：
接下来，单击“计算”选项卡，然后搜索“字体家族”：
您应该在此处看到字体的名称及其样式。
要查看与字体相关的CSS，请在“样式”选项卡下查找。 您可以滚动浏览以搜索与字体相关的值。 但是，由于此处可能存在覆盖和不相关的样式规则，因此“计算”选项卡通常更有用。
2.通过浏览器扩展查找字体
浏览器扩展程序可以提供一种更直接的方法来查找网站上的字体详细信息，尤其是当您对Inspector不满意时。 另外，他们通常可以更快地提供您正在寻找的答案，以便您可以立即完成任务。
这些附加组件包括：
- 丰塔内洛：可以免费使用，此扩展程序使您可以在浏览时突出显示并右键单击字体，从而更轻松地找到字体的名称，粗细，样式。
- 什么字体：进一步简化了字体检测，WhatFont使您只需悬停在字体上即可查看字体名称。
- CSS窥视器：用 网页设计师 请注意，此扩展功能更强大，可以告诉您网页CSS代码中的其他详细信息。
但是，每个扩展都有不同的浏览器支持。 WhatFont可用于Firefox，Chrome，Safari和Internet Explorer。 另一方面，Fontanello仅适用于Firefox和Chrome。 CSS Peeper是Chrome专用的工具，您将无法在任何其他平台上使用它。
为了快速查找特定字体的名称，WhatFont是最容易使用的选项。 由于它也支持大多数浏览器，因此我们将使用它进行快速演示。
安装WhatFont之后，您可以通过在浏览器的工具栏中将其激活并悬停在某些文本上来检查网站使用的字体：
第一次将鼠标悬停在文本上时，您只会看到字体的名称。 但是，单击名称将显示一个展开的弹出窗口，其中包含更多详细信息，例如大小，重量，颜色和行高。 它还可以识别是否可以通过Typekit或Google字体使用字体。
完成字体详细信息检查后，您可以使用浏览器窗口右上角的Exit WhatFont按钮退出该工具。
3.检测图像中的字体
最后，您也可以尝试查看图像中使用的字体。 这包括您见过的字体 在徽标中 或图表。 在 我们在字体检测器方面的经验， 什么字体 是这项工作最有效的在线工具。
要使用WhatTheFont，您需要上传相关图片并选择具有相关字体的部分：
然后，它将返回一个结果页面，其中包含几种字体，即使不是完全匹配，它们也与您尝试识别的字体相似：
根据字体的来源和受欢迎程度，您的成功率可能会有所不同。 如果字体的确切名称对您来说非常重要，则可能很难找到可以满足您需求的工具。
但是，如果您愿意使用与在图像中找到的字体相似的字体，则在线检测器应该可以满足您的需求。
结论
视觉上吸引人的字体可以增强您网站访问者的阅读体验。 这可能会提示您继续寻找可在网站或客户上使用的新字体。 不管您出于何种原因想要查看网站使用的字体，都有许多工具可以为您提供帮助。
在本文中，我们讨论了三种方法来查看网站使用的字体：
您对如何检查网站上使用的字体有任何疑问吗？ 让我们在下面的评论部分中知道！
图片来自rudall30 / shutterstock.com