最近公司产品用微软雅黑,被告~  领导要求产品后台系统必须更换字体,美工给了个宋体,个人觉得太丑,就网上搜了些处理方法使用

CSS属性 @font-face 自定义字体, 最后决定用 思源黑体 (思源黑体是AdobeGoogle宣布推出的一款开源字体,详细内容自行百度,.ttf文件font-spider 的github上有提供下载地址)。

思源黑体中文字体包竟然有10几M 页面加载速度太慢,所以就百度解决方案,搜到了字蛛 font-spider ,很好用的一款开源工具。

给个友情链接: http://font-spider.org/   网站和 github上有使用方法和代码。

记录下自己的使用过程以便以后回忆:

   1: 安装 node.js; (我自己机器本身就安装过,之前有简单的玩过node)

2:npm install font-spider -g    PS: 本机是Win7, 也有可能本机环境问题,需要安装一个font依赖包 以及python(记得配置环境变量).

3:  接下来根据网站的步骤的本地新建css文件、html文件 ,而我们系统是jsp文件 需要转,正好 我们系统做过国际化,所有系统所需要的文字 全部在资源文件当中,然后新建一个html文件 将

资源文件中所有的汉字全部拷贝进去,哈哈 就是这么省事。

4: 最后命令行 运行 font-spider test.html ,  大功告成, 字体文件只有100多KB,作为后台管理系统完全可以了。

上一下最后成功的图片,哈哈OK了,结束。

PS: 不过只是自己玩了玩,最后还是没用到系统里,我觉得如果静态页面用还是很不错的,但是因为系统后台有很多新增数据,很多字体肯定没打包到里面的,到时候会有部分字体显示不同,有点尴尬,但是我觉得慢慢更新字体包也何尝不可,多改几次BUG,很快就丰富了,个人理解。

不过以后做静态网站什么的还是用的到的,写个博客做个记录,以便以后回忆。

开源字体包缩减font-spider的更多相关文章

  1. app 要求字体使用楷体,使用字体包

    1,下载字体包     http://www.3987.com/xiazai/6/fonts/36616.html#down 2.  studio中src\main\创建assets\fonts,存放 ...

  2. 《隆重介绍 思源黑体:一款Pan-CJK 开源字体》

    关于思源黑体 思源黑体是谷歌与 Adobe 联合开发,支持简体中文.繁体中文.日文.韩文以及英文:支持 ExtraLight.Light.Normal.Regular.Medium.Bold 和 He ...

  3. ubuntu单独安装字体包

    查看当前字体的命令: fc-list 文泉驿字体下载地址: http://wenq.org/wqy2/index.cgi?ZenHei#v0_8 下载到的是一个deb安装包 在下载完字体以后将字体包拷 ...

  4. Java运用第三方开源jar包sigar.jar获取服务器信息

    通过使用第三方开源jar包sigar.jar我们可以获得本地的信息 一.准备工作 (1)下载jar包和相关文件 资源链接:百度云:链接:https://pan.baidu.com/s/1nxccJHJ ...

  5. AngularCli项目中添加字体图标(Font)详解

    本文主要讲如何在AngularCli生成的项目中使用字体图标. 一 SVG图标准备 将需要转换为字体图标的图片转换为SVG格式. 这个让项目视觉设计师搞定即可. 二 SVG图标转Font 可以通过Ic ...

  6. 字蛛(font-spider)-单独压缩字体(解决页面少有的特殊字体的字体包引用)

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

  7. vue 引入第三方字体包

    1.创建 style_css 文件夹,在当前文件夹下 新建 index.css  和  引入字体包. 2. 在build 目录下,设置 webpack.base.cong.js ,  在module ...

  8. css 文本外观属性(text) 和 字体样式属性(font)

    css文本 text外观属性 color: 颜色值(red,blue)十六进制 ,rgb letter-spacing: 字间距 px,em word-spacing: 单词间距 对中文无效 line ...

  9. 开源字体不香吗?五款 GitHub 上的爆红字体任君选

    作者:HelloGitHub-ChungZH 在编程时,用一个你喜欢的字体可以大大提高效率,越看越舒服.这篇文章就推荐 5 个在 GitHub 上优秀的字体供大家选择吧! 1. Iosevka 网站: ...

随机推荐

  1. SDPLR的安装过程(matlab)

    SDPLR 半正定规划优化工具的安装过程很简单,只要按照SDPLR 1.03-beta User's Guide (short version).pdf的介绍安装就可以. 运行在下载的工具包目录里运行 ...

  2. 主流智能手机屏幕材质介绍 及 LCD闪屏现象分析

    TN            TN(Twisted Nematic) 即扭曲向列型面板,属于有源矩阵液晶显示器中的一种.由于TFT是主动式矩阵LCD可让液晶的排列方式具有记忆性,不会在电流消失后马上恢复 ...

  3. C标准库简单解读

    1,程序运行时动态链接共享库; libc(character),libm(math),使用标准库的函数; eg:stdlib.h exit(); size_t数据类型,NULL空指针在头文件stdde ...

  4. 5 weekend01、02、03、04、05、06、07的分布式集群的HA测试 + hdfs--动态增加节点和副本数量管理 + HA的java api访问要点

    weekend01.02.03.04.05.06.07的分布式集群的HA测试 1)  weekend01.02的hdfs的HA测试 2)  weekend03.04的yarn的HA测试 1)  wee ...

  5. PAT 1004. Counting Leaves (30)

    A family hierarchy is usually presented by a pedigree tree.  Your job is to count those family membe ...

  6. IOS开发之UINavigationBar

    简介 UINavigationBar是用于实现管理层级关系内容的组件,直接继承自UIView.通常用在UINavgationController类中,用于管理和显示UINavgationControl ...

  7. 导出Unity场景为配置文件

    在处理很多人参与的项目时,很多时候在操作场景时,可能会牵扯到场景修改的冲突问题,这种时候,我们可以将场景以配置文件的形式存储下来(cocos的场景.android的view保存思想),可以采用json ...

  8. iOS 利用Socket UDP协议广播机制的实现

    1.前言 什么是UDP协议广播机制? 举一个例. 比如在一群人群中,一个人要找张三,于是你向人群里大喊一声(广播):"谁是张三" 假设它是张三,它就会回应你.在网络中也是一样的. ...

  9. 像C++一样写JavaScript

    像C++一样写JavaScript C/C++/Java的include或import可以引用第3方文件和包. 这个功能在Html/Js里没有默认的实现. 假设我们有这样一个HTML文件index.h ...

  10. Windows 下启动Apache服务(转)

    Win下apache出现问题:“No services installed”安装完apache之后(不是按照默认路径安装的,我的是 D:\ )右下方那个小羽毛图标是没有启动的,左键不好使,而且提示“N ...