用 字蛛 取出需要的字符应用字体 @font-face
一、安装font-spider
npm install font-spider -g
二、目录结构
font-spider
font
FZZZHONGHJW.ttf
font.html
三、font.html内容
<!DOCTYPE html>
<html>
<head>
<title>方正正中黑简体</title>
<meta charset="utf-8">
<style type="text/css">
@font-face {
font-family: 'FZZZHONGHJW';
src:
url('font/FZZZHONGHJW.eot?#font-spider') format('embedded-opentype'),
url('font/FZZZHONGHJW.woff') format('woff'),
url('font/FZZZHONGHJW.ttf') format('truetype'),
url('font/FZZZHONGHJW.svg') format('svg');
}
p{
font-family: "FZZZHONGHJW";
}
</style>
</head>
<body> <!-- 全局 -->
<p>班级情况 布置作业 教学资源</p> </body>
</html>
四、从字体文件中把页面字体抓取,生成字体文件,执行命令:
font-spider font.html
五、生成后的目录结构
font-spider
font
.font-spider
FZZZHONGHJW.ttf
FZZZHONGHJW.eot
FZZZHONGHJW.svg
FZZZHONGHJW.ttf
FZZZHONGHJW.woff
font.html
用 字蛛 取出需要的字符应用字体 @font-face的更多相关文章
- 字蛛(font-spider)-单独压缩字体(解决页面少有的特殊字体的字体包引用)
特别想独立的把这个问题写成一篇内容,分享给大家. 反正我是这个字体压缩使用的受益者,不是打广告. 很久以前,设计师总是爱用一些奇奇怪怪的字体放在页面上,而作为前端我们很容易的就能直接使用TA们用到的字 ...
- 中文WebFont解决方案Font-Spider(字蛛)
我们在日常需求中,经常会碰到视觉设计师对某个中文字体效果非常坚持的情况,因为页面是否高大上,字体选择是很重要的一个因素,选择合适的字体可以让页面更优雅.面对这种问题,我们通常以下方式来进行设计还原: ...
- 字蛛fontSpider的使用
字蛛官方文档 http://font-spider.org/index.html 首先安装全局包 npm install font-spider -g 然后下载字体 ,本次需要的是 "造 ...
- fontSpider字蛛,好用的字体压缩工具教程
一直觉得很多字体特别好看,但是那些好看的字体只能做在图片上不能用CSS样式去实现,作为一个会设计的前端,真心觉得很烦恼,有时候那些文字需要更换,修改起来非常麻烦,要到处去找源文件,找不到源文件还要尽力 ...
- 精简TTF字体、FontPruner、汉字字体瘦身(非字蛛)
20190726更新 标黄部分 网上比应用比较多的 字蛛 http://font-spider.org/ 本文使用了本机安装软件,得到瘦身后的 TTF 字体文件 准备工具: python : 我使用是 ...
- 编码对象或者字串中包含Unicode字符怎样转换为中文
In [18]: c = '你好' In [20]: d = c.encode('unicode_escape') In [21]: d Out[21]: b'\\u4f60\\u597d' In [ ...
- ASP清除字串中的重复字符
<% Function Test(str) dim intLen,i,strTemp,aryTest intLen = Len(str) strTemp = "" aryTe ...
- 字蛛webfont 安装及使用方法
先安装nodejs和git,比如放在D:/nodejs/ 文件夹 cmd 进入该文件夹,安装npm install express 安装 npm install font-spider -g 安装 ...
- css 字间距离_css 字体字符间距设置
介绍下css 字间距,使用css来控制字与字之间距离,也叫css字间距方法. 使用到的css样式属性单词text-indent抬头距离,letter-spacing字与字间距. Css字间距.div ...
随机推荐
- url传值的长度限制解决办法
今天写到两个页面传值,刚开始通过url上加参数进行传值, var strLink = "my.asp?str1=" + str1List + "&str2=&qu ...
- scss常规用法
保持sass条理性和可读性的最基本的三个方法:嵌套.导入和注释. 一般情况下,你反复声明一个变量,只有最后一处声明有效且它会覆盖前边的值. $link-color: blue; $link-color ...
- node.js入门之一
简单的说 Node.js 就是运行在服务端的 JavaScript. Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台. Node.js是一个事件驱动I/O服务端Ja ...
- 数据分析师入门|Python安装MAC版
最近在学数据分析师入门课,看了大纲,感觉终于不再慌乱踩坑了,开始存档最粗暴版学习笔记,遇到停止的地方按照下文红字直接输入就OK,方便和我一样的小伙伴参考呀,老师讲的很适合我这种初学者,PUSH了很多资 ...
- STL:set的使用
关于set set是以特定的顺序存储相异元素的容器. set是关联式容器,C++ STL中标准关联容器set, multiset, map, multimap内部采用的就是一种非常高效的平衡检索二叉树 ...
- Java软件开发不同薪资级别-技术要求
15~20万 WEB应用服务器(Tomcat.Weblogic.Jetty.JBoss.WebSphere) NoSQL(Redis.MongoDB.HBase.Memcache) 消息中间件(Kaf ...
- 给SVN控制的项目添加忽略文件/文件夹
忽略目录其实有些像建立一个文件夹,但却不放入版本控制.如果不加入版本控制又会在svn status命令中显示出来,很不方便,所以可以设置本文件夹属性,让它既加入版本控制,又忽略其变化 未加入控制的文件 ...
- mysql安装及navicat连接
1.下载mysql官方连接:https://dev.mysql.com/downloads/mysql/ 下载成功后,解压到自己想要的路径下并创建my.ini文件和配置环境变量 然后我们在根目录下创建 ...
- https://blog.csdn.net/blmoistawinde/article/details/84329103
背景 很多场景需要考虑数据分布的相似度/距离:比如确定一个正态分布是否能够很好的描述一个群体的身高(正态分布生成的样本分布应当与实际的抽样分布接近),或者一个分类算法是否能够很好地区分样本的特征 ...
- 全国高校绿色计算大赛 预赛第一阶段(Python)
第1关将字符串反转 #!/usr/bin/env python # -*- coding: utf-8 -*- class Task: def inversion(self, str): # **** ...