用 字蛛 取出需要的字符应用字体 @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 ...
随机推荐
- Effective Java读书笔记完结啦
Effective Java是一本经典的书, 很实用的Java进阶读物, 提供了各个方面的best practices. 最近终于做完了Effective Java的读书笔记, 发布出来与大家共享. ...
- 锐动SDK置于社区沙龙
北京锐动天地信息技术有限公司成立于2007年9月.多年来一直专注于音视频领域核心技术的研发, 拥有Windows.iOS.Android全平台自主知识产权的领先技术产品. 2011年获得新浪战略投资, ...
- 基于C++11的call wrapper
要在C++中应用AOP,不像在其他的基于解释器的语言中那么方便,作为一种静态语言,如果给函数或者类的方法造一个wrapper,在wrapper里面嵌入调用前的代码和调用后的代码,也能达到一定程度的代码 ...
- sql语句中截取字符串
今天在开发过程中因为要用到合并单元格,在程序里实现了以后,查出来的数据太长,都把格式撑大了,后来想想可以在sql语句查询的时候就截取,就去网上找了一下,挺好用,就转了过来: 合并单元格: /// &l ...
- Node.js——流的下载
https://cnodejs.org/topic/59d8f43b2543cb3368b1623e var request = require('request'); var fs = requir ...
- Websocket 关闭浏览器报错
这个报错,是因为你关闭之后,websocket 自动连接失败造成的 只要在你的websocket 运行的类里面加上: @OnError public void onError(Throwable e, ...
- 【分享】4412开发板POP烧写ubuntu出错,如何挂载emmc分区解决方法
本文转自:http://bbs.topeetboard.com 平台:4412精英版系统:ubuntu系统 按照教程烧写ubuntu文件系统,TF卡和EMMC分区都完成(总之之前的操作试了几遍都是没问 ...
- 03C#数据类型
C#数据类型 值类型和引用类型区别 在C#语言中,值类型变量存储的是指定数据类型的数据,值类型变量的值(或实例)存储在栈(Stack)中,赋值语句是传递变量的值.引用类型(例如类就是引用类型)的实例, ...
- NPOI--------------.Net操作Excel初步使用(导出)
背景 因公司项目需要添加数据导出功能故此添加,找了几种方式发现该方式具有 无需依赖本机安装office环境,使用灵活等优点故采用此方式. 安装 Nuget 直接安装NPOI即可 使用方式 1.根据需要 ...
- laravel-admin常见错误处理
php artisan key:generate 新的laravle会有密钥不存在的问题,这时候我们执行这句话就可以生成秘钥了