今天写好了一个网页,开心的放到了云服务器,查看效果,结果发现忘记把字体文件拷过去。但是当字体文件拷过去后,再次访问网页时,网页加载变得十分缓慢,几分钟后才会将字体加载完成。
当时那个郁闷啊,才四个字用的着加载那么那么久。然后想起了菜鸡教程对CSS3 @font-face 规则的介绍中有一句是这样的,只需简单的将字体文件包含在网站中,它会自动下载给需要的用户。
要下载给用户???
也就是说在加载网页的过程中要下载十几 MB的字体文件。我就用了四个字,想把 .ttf 文件中我使用的那几个字找出来,重新生成一个 .ttf 文件,肯定只有几 KB。
emmmm,我觉得我的想法很好,但是 .ttf 文件要怎么搞呢?略微一想,网上肯定有这种操作。
果不其然,我搜到了,说要下载个node.js。。。。。。。
一脸茫然,nodejs这是个什么鬼?算了,先下下来,然后按照步骤试试看。
第一步:不要在node.exe中执行 npm install font-spider -g
要在
win+R
打开控制台后,在 node.exe 的文件按路径下执行npm install font-spider -g
我忘记按了几次回车。
执行完成后的
第二步:进行抽取操作,如图
查看效果
第二步的操作将原来的字体文件中多余的字体去除,生成新的覆盖掉原来的,同时创建了新的文件夹将原来的字体文件保存到该文件夹下了。
开启浏览器,查看网页,字体直接是秒加载,爽~~~。
问题
1、如果其他的个页面也使用了该字体,但是文字不样。猜测会将所有的页面的文字抽取生成一个,翻盖之前的。
2、应该有动态抽取的把,这个好麻烦,参照之前找字体的网站,在输入框输入文字,然后点击转换,也是飞快的就加载出来了。莫非,每个汉字都有对应的 .ttf 文件。根据输入的字查出对应的.ttf 加载显示???
网友评论