字蛛(font-spider)-单独压缩字体(解决页面少有的特殊字体的字体包引用)
特别想独立的把这个问题写成一篇内容,分享给大家。
反正我是这个字体压缩使用的受益者,不是打广告。
很久以前,设计师总是爱用一些奇奇怪怪的字体放在页面上,而作为前端我们很容易的就能直接使用TA们用到的字体包,但是,字体包一般都好几兆,特别占内存,特别拉慢页面的加载速度。久而久之我就不爱设计师设计的字体了。就用电脑,手机默认的字体;
问题是,这样的话总是有点差距的。所以这时我们的解决方案就是:特定的文字压缩,这时文字包就只有kb了。所以知道了这个-字蛛
要使用字蛛步骤:
1.首先是要在电脑上先安装NodeJS的
2.安装好后,打开window+R,输入cmd,进入命令块配置
3.输入指令:npm install font-spider -g
4.完成后,即可开始压缩你需要使用的字体了
5.新建html基本文件夹ziti(css、js、images、html<须引用字体包放入css,html页面的写入需要压缩的文字>)
引用的字体务必使 .ttf 格式的
6.桌面--windows--CMD-放文件夹的盘:cd/ziti>Font-spider ./index.html
以上步骤就能完成了,真的真的非常完美
字蛛(font-spider)-单独压缩字体(解决页面少有的特殊字体的字体包引用)的更多相关文章
- fontSpider字蛛,好用的字体压缩工具教程
一直觉得很多字体特别好看,但是那些好看的字体只能做在图片上不能用CSS样式去实现,作为一个会设计的前端,真心觉得很烦恼,有时候那些文字需要更换,修改起来非常麻烦,要到处去找源文件,找不到源文件还要尽力 ...
- 中文字体压缩器-解决css引入的字体太大的问题
字蛛是一个中文字体压缩器 官方网站:http://font-spider.org/index.html 用于解决页面引入的css字体过大的问题 使用方法: npm i -g font-spider 在 ...
- 精简TTF字体、FontPruner、汉字字体瘦身(非字蛛)
20190726更新 标黄部分 网上比应用比较多的 字蛛 http://font-spider.org/ 本文使用了本机安装软件,得到瘦身后的 TTF 字体文件 准备工具: python : 我使用是 ...
- 中文WebFont解决方案Font-Spider(字蛛)
我们在日常需求中,经常会碰到视觉设计师对某个中文字体效果非常坚持的情况,因为页面是否高大上,字体选择是很重要的一个因素,选择合适的字体可以让页面更优雅.面对这种问题,我们通常以下方式来进行设计还原: ...
- 字蛛fontSpider的使用
字蛛官方文档 http://font-spider.org/index.html 首先安装全局包 npm install font-spider -g 然后下载字体 ,本次需要的是 "造 ...
- 字蛛webfont 安装及使用方法
先安装nodejs和git,比如放在D:/nodejs/ 文件夹 cmd 进入该文件夹,安装npm install express 安装 npm install font-spider -g 安装 ...
- grunt 单独压缩多个js和css文件【转】
原文地址:http://xiaomiya.iteye.com/blog/2177877 使用grunt来压缩前端js,css文件 因为最近做的客户端本地项目有用到十几个js,js提交之前都需要压缩.用 ...
- CSS3 关于@font-face引用中文字体解决办法
有两种方法,一种简单的,一种比较复杂,都可以实现(注:这里的方法只适合使用少量的中文字体,如果使用的字量过大,请使用其他方法解决) 第一种:简单的 1.下载需要的中文字体的.ttf格式,这个都不难找到 ...
- 问题记录 为ubuntu16.04添加windows字体(解决JIRA图表乱码的问题)
最近遇到了JIRA在新的ubuntu机器上图表的中文无法正确显示的问题,解决的方法是,为ubuntu安装中文字体,我们选择把windows上的字体复制到ubuntu上来安装的方法,步骤如下: 从win ...
随机推荐
- C++:100阶乘数组输出
#include <iostream> using namespace std; int main(){ int i =1; int a[2048]={0}; while(i !=101) ...
- 【jenkins】jenkins执行nohup java报错
nohup:failed to run command 'java':No such file or directory 这是因为jenkins只认绝对路径.在shell里面有涉及到文件的都应该写成绝 ...
- 14-15.Yii2.0模型的创建/读取数据使用,框架防止sql注入
目录 创建数据库 表article 配置 db.php 连接数据库 创建控制器 HomeController.php 创建models 创建数据库 表article 1.创建库表 CREATE TAB ...
- python-闭包函数和装饰器
目录 闭包函数 什么是闭包? 两种为函数传参的方式 使用参数的形式 包给函数 闭包函数的应用 闭包的意义: 装饰器 无参装饰器 什么是装饰器 为什么要用装饰器 怎么用装饰器 完善装饰器 闭包函数 什么 ...
- 更改activity切换方式
overridePendingTransition(enterAnim, exitAnim); Intent intent =new Intent(this,item2.class); startAc ...
- dedecms 标签
article文章页标签 文档工具:http://tools.dedecms.com/dedetag_maker/article.html {dede:field.title/} 文章标题 {dede ...
- JS实现——用3L和5L量出4L的水
把以下代码保存成donglanguage.html文件,使用Google或360浏览器打开 <!DOCTYPE html> <html> <head> <me ...
- 小白用shiro(1)
本文来自网易云社区 作者:王飞 首先引入一段关于shiro的介绍: 开发系统中,少不了权限,目前java里的权限框架有SpringSecurity和Shiro(以前叫做jsecurity),对于Spr ...
- ranorex官网
youtube FQ看ranorex https://demo.glyptodon.com 虚拟机 安卓实体 ranorex 只支持 Rxbrowser 我想操作安卓机器上的chrome 所以装了 ...
- 使用mysql监视器即命令行下的mysql
命令行下登录mysql 首先必须在alias下有设置mysql, 我的mysql安装的位置在/usr/local/mysql 于是做了一个别名: alias mysql='/usr/local/mys ...