css自定义字体转换工具_5种最佳CSS3字体工具

css自定义字体转换工具

自从将图形支持添加到浏览器以来，字体在网络上产生了最戏剧性的视觉影响。 几年前，不可能找到使用Arial，Verdana，Tahoma，Times New Roman或Georgia （或天堂禁止，Comic Sans）以外的任何网站 。

尽管标准字体堆栈没有任何问题，但它们可能会变得有些单调。 Internet Explorer支持Web字体已有十多年的历史，但是与竞争对手的浏览器相比，它花了更长的时间才能赶上。 许可仍然是一个问题-您不能使用任何商业字体-但您应该能够找到一种允许使用网络或与您的企业风格相似的字体。

但是，有很多选择就会带来很大的责任。 幸运的是，有一些在线工具可以帮助您查找和使用CSS3字体…

1. Google网络字体

如果您还没有访问过Google Web字体，那么您去哪儿了？ Google提供了200多种字体，并且审阅工具很棒。

您可以下载任何字体文件，但该工具还允许开发人员通过HTML link标记，CSS @import声明或JavaScript代码段进行导入。 Google强调了潜在的下载速度问题，但是，由于您可以使用其CDN ，因此无需担心托管问题。

我是否提到过全部免费？ Google网络字体将满足最苛刻的设计师要求。

2.字体松鼠

松鼠字体非常出色-特别是如果您不愿意将所有字体职责交给Google时。 该网站提供了数百种免费的商业使用的高质量字体。 您可以下载TTF，EOT，WOFF和SVG字体文件以及@ font-face套件 ，这些套件提供在所有主要浏览器中都可以使用的防弹代码和示例。

还是不满意？ 将许可的字体文件上传到@ font-face生成器 ； 它将以示例CSS代码以多种网络格式提交给您。 您需要为该服务支付多少费用？ 一分钱都不会花。

3.字体拖动器

仅仅因为字体可以在网络上使用，并不意味着应该使用。 诸如Helvetica和Georgia之类的字体被设计为可以在屏幕上很好地工作，但是并非所有字体都是相同的，尤其是小字体。

因此，您应该先测试该中世纪脚本字体，然后再将其添加到页面中。 字体拖动器使操作变得简单—将字体文件拖动到页面上，文本将发生神奇的变化。

4. FFFFallback

并非所有用户都能体验到您漂亮的字体。 使用较旧浏览器的浏览器可能不支持Web字体，因此，在移动设备上应避免使用它们，这是有充分理由的。

幸运的是，CSS支持后备字体堆栈：依次尝试字体，直到找到字体为止。 但是，字体具有不同的大小和间距，因此特定的回退可能会破坏您的设计。

FFFFallback.com是一个了不起的书签，它显示了您的网站使用不同字体的外观。 它将页面的副本覆盖在原始页面的顶部，因此您可以立即发现格式问题。

5. WhatFont

如果您在野外发现了可爱的字体， WhatFont是另一个书签，可帮助您识别字体和大小。 启动工具，然后将鼠标悬停或单击任何元素。 还有什么更简单的？

额外的字体工具

渴望更多？ 如果您有时间和爱好，可以使用FontStruct和Bitfontmaker创建自己的字体。 两者都提供了由才华横溢的艺术家创作的一系列免费字体。

字体矩阵和常用字体列出了Windows和Mac上的主要字体和替代备用字体。 请务必先检查这些内容-如果大多数平台上普遍都可以使用网络字体，则无需使用网络字体。

您知道其他出色的字体工具吗？

翻译自: https://www.sitepoint.com/5-of-the-best-css3-font-tools/

css自定义字体转换工具