如何生成eot字体

简介: 前一段时间听闻Google退出ubuntu字体的时候,使用了一下,从而了解到 font-face 的用法: @font-face{font-family:'yahei';src:url(../images/msyh.eot);} 利用这种方式,就可以在网页上显示用户的系统中不存在的字体。

前一段时间听闻Google退出ubuntu字体的时候,使用了一下,从而了解到 font-face 的用法:

@font-face{font-family:'yahei';src:url(../images/msyh.eot);}

利用这种方式,就可以在网页上显示用户的系统中不存在的字体。对于保证我们设计的一致性,减少图片的使用是非常有帮助的。

那么如何才能生成对应字体的EOT文件呢?

查阅资料后,找到了三个方法:

1、在线字体转换:Font Squirrel

image

这个网站为我们提供了一个在线的字体转换服务,缺点是对于字体文件的大小有限制,更适合用来转换英文类的字体。

2、使用ttf2eot。

ttf2eot 是一个开源项目。支持Linux和Windows的环境,能够快速的生成EOT文件。使用起来也非常方便。

3、Microsoft WEFT。

Microsoft WEFT是微软推出的一款用来解决网页字体问题的软件。这款软件能够分析你的网页中调用了哪些字体(应当是通过css判断出来)然后会从系统中选择对应的字体进行转换,生成的EOT文件,也会根据页面中用到的字体情况进行缩减,所以生成的文件比较小。我认为非常适合用于中文类字体的生成。

具体的操作工程如下:

5aacef20d35a0638375fb64ef7d8fbff1.jpg

安装程序并运行后,点击Wizard,第一步是输入姓名和邮箱,完成后进入到网页选择的界面。这里是选择要用到特殊字体的页面。点击下一步后会弹出一个关于编码问题的对话框,一直点继续就可以了。

e111f05a838b3d09dac0b53523f91fbf1.jpg

接着,WEFT会分析你的网页中用到了哪些字体。一般通用的字体,我们可以不选择嵌入,只对特定的字体进行转换。

76c8d37b30ed152f8c64e9fc00bd77881.jpg

之后,在选择生成文件保存的位置,就可以生成文件了。

d1b24effee66032fb6fdf7dd589718bb1.jpg

将生成的文件拷贝到服务器的指定位置,在对应的页面中补充 font-face 样式,就可以实现在用户浏览器上显示特殊字体的目的。

 

参考资料:
1、用Microsoft WEFT工具制作EOT字库
2、网页字体终极解决方案
3、TTF2EOT
4、Font Squirrel
5、Microsoft WEFT
6、CSS嵌入任意字体

相关文章
|
2天前
字体大小
字体大小。
20 5
|
13天前
markdown字体大小颜色样式详解
【4月更文挑战第10天】Markdown不直接支持字体样式设置,但可通过HTML标签实现。如用`<font face="字体名">`改变字体,`<font color=颜色值>`改变颜色,`<font size=数字>`调整大小。组合使用如`<font face="黑体" color=green size=5>`可同时设置。注意并非所有Markdown解析器都支持这些语法,使用前需查阅解析器文档。
17 1
|
5月前
|
SQL JavaScript
markdown字体大小颜色样式
markdown字体大小颜色样式
|
Java
关于TrueType字体的gasp技术说明
关于TrueType字体的gasp技术说明
79 0
LaTeX:字体字号榜值对比
LaTeX 的字体大小设置有 `\small, \large` 等,与 Word 上的字号大小有对应
356 0
|
前端开发 开发者
字体 | 学习笔记
快速学习字体
115 0
字体 | 学习笔记
Markdown设置字体大小、颜色...,CSDN博客编写设置字体大小、颜色、粗细。字体,文字背景设置。
Markdown设置字体大小、颜色...,CSDN博客编写设置字体大小、颜色、粗细。字体,文字背景设置。
583 0
Markdown设置字体大小、颜色...,CSDN博客编写设置字体大小、颜色、粗细。字体,文字背景设置。
|
图形学
字体问题
字体问题
128 0
|
Python
在Maptlotlib中使用Helvetica字体
关注九天学者微信公众号(扫码关注)第一时间获取技术贴更新! 在学术论文中的图件(Scientific figures),优秀的图有四个特点:简单(Simple)、清晰(Clean)、易读(undisputedly easy to read)、美观。
1305 0
markdown编辑器(颜色、大小、字体)
我是黑体字 我是微软雅黑 我是楷体 呈现效果 我是黑体字我是微软雅黑我是楷体 浏览器默认值是 3 颜色值 参考:CSDN-markdown编辑器语法——字体、字号与颜色
1438 0