一、安装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的更多相关文章

  1. 字蛛（font-spider）-单独压缩字体（解决页面少有的特殊字体的字体包引用）

    特别想独立的把这个问题写成一篇内容,分享给大家. 反正我是这个字体压缩使用的受益者,不是打广告. 很久以前,设计师总是爱用一些奇奇怪怪的字体放在页面上,而作为前端我们很容易的就能直接使用TA们用到的字 ...

  2. 中文WebFont解决方案Font-Spider(字蛛)

    我们在日常需求中,经常会碰到视觉设计师对某个中文字体效果非常坚持的情况,因为页面是否高大上,字体选择是很重要的一个因素,选择合适的字体可以让页面更优雅.面对这种问题,我们通常以下方式来进行设计还原: ...

  3. 字蛛fontSpider的使用

    字蛛官方文档 http://font-spider.org/index.html 首先安装全局包  npm install font-spider -g 然后下载字体 ,本次需要的是  "造 ...

  4. fontSpider字蛛，好用的字体压缩工具教程

    一直觉得很多字体特别好看,但是那些好看的字体只能做在图片上不能用CSS样式去实现,作为一个会设计的前端,真心觉得很烦恼,有时候那些文字需要更换,修改起来非常麻烦,要到处去找源文件,找不到源文件还要尽力 ...

  5. 精简TTF字体、FontPruner、汉字字体瘦身（非字蛛）

    20190726更新 标黄部分 网上比应用比较多的 字蛛 http://font-spider.org/ 本文使用了本机安装软件,得到瘦身后的 TTF 字体文件 准备工具: python : 我使用是 ...

  6. 编码对象或者字串中包含Unicode字符怎样转换为中文

    In [18]: c = '你好' In [20]: d = c.encode('unicode_escape') In [21]: d Out[21]: b'\\u4f60\\u597d' In [ ...

  7. ASP清除字串中的重复字符

    <% Function Test(str) dim intLen,i,strTemp,aryTest intLen = Len(str) strTemp = "" aryTe ...

  8. 字蛛webfont 安装及使用方法

    先安装nodejs和git,比如放在D:/nodejs/  文件夹 cmd 进入该文件夹,安装npm install express 安装 npm install font-spider -g 安装  ...

  9. css 字间距离_css 字体字符间距设置

    介绍下css 字间距,使用css来控制字与字之间距离,也叫css字间距方法. 使用到的css样式属性单词text-indent抬头距离,letter-spacing字与字间距. Css字间距.div ...

随机推荐

  1. SSH---整合Struts2&Spring&Hibernate(实例)

    一.SSH回顾 Struts2:核心为过滤器+拦截器.过程:Filter--->FilterDispatcher-->ActionMapper-->ActionProxy--> ...

  2. [经典面试题]包含T全部元素的最小子窗口

    题目描述 给定一个包含一系列字符的集合T和字符串S,请在字符串S中找到一个最小的窗口,这个窗口中必须包含T中的所有字符.  例如,  S = "ADOBECODEBANC"  T ...

  3. 什么是混合app开发

    webApp 移动app 就是在浏览器中运行的web应用 (网页应用)开发成本低 体验差 不需要安装 NativeApp :用Android和object-C原生语言开发的应用 开发成本高 需要安装( ...

  4. 【My First Blog】评近期国产烂片-《何以笙箫默》

    昨晚,我脑抽去看了[何以笙箫默],看完后我的感觉就是被这部片子恶心到了,现在想起来我还是想说:何以笙箫默是烂片烂片烂片!重要的是说三遍.以前,我问电视剧版<何以笙箫默>何以这么LOW,看了 ...

  5. 迅为IMX6开发板支持4G全网通模块GPS模块

    IMX6开发板特点 处理器:IMX6开发板支持4G全网通模块GPS模块. 核心板配置:2GB DDR3内存  16GB EMMC 存储,扩展引脚多达320个:运行温度-20 ℃到+80 ℃之间. 核心 ...

  6. Tensorflow入门-上

    前置准备 在阅读本文之前,请确定你已经了解神经网络的基本结构以及前向传播.后向传播的基本原理,如果尚未了解,可以查看下文. 深度学习之神经网络 什么是TensorFlow? TensorFlow是Go ...

  7. CAD参数绘制直线（com接口）

    用户可以在CAD控件视区任意位置绘制直线. 主要用到函数说明: _DMxDrawX::DrawLine 绘制一个直线.详细说明如下: 参数 说明 DOUBLE dX1 直线的开始点x坐标 DOUBLE ...

  8. 小写bool和大写BOOL的区别

    转:https://blog.csdn.net/ji0525084/article/details/8594469 bool是标准C++中的布尔量,占一个字节大小内存,只有false或者true.具有 ...

  9. vue slot的使用介绍

    插槽:slot (不知道我这样理解是不是对的,欢迎大佬指点) 具体是什么样子的,请看例子说明 父组件代码 子组件代码 结果 可以看到 ,结果是父组件里面内容显示了,子组件内容显示了,但是在父组件中插入 ...

  10. 一键分享到QQ空间、QQ好友、新浪微博、微信代码

    通过qq空间.qq聊天.新浪微博和微信二维码分享平台提供的接口,实现把网页中对应的图片.标题.描述的信息参数用javascript获取后传进接口中,实现一键分享. 使用到的接口(测试时需要登录,网址和 ...