在第一次尝试 Semantic UI 后,发现其 css 中第一行,就引用了 fonts.googleapis.com 中的字体。

不知道为什么要这么做,也许在国外,google 的服务已经是一种互联网的基础设施了?

但是在中国,都懂的,这会大大的拖慢网站的加载速度,甚至加载出错。

其实还有一种情况,就是完全离线的网站,与互联网断开的,总不能连接到 google 去下载字体吧~

话说查找这个问题的解决方案过程中,发现一个网站(https://google-webfonts-helper.herokuapp.com/fonts),可以方便的下载谷歌的字体,不需要自己费劲的去扒了。

不过也还好,Semantic UI 提供了对这个功能的开关。

在 src 文件夹中的 themes\default\globals\site.variables 文件中

可以找到这样一行配置:

@importGoogleFonts : true;

嗯,把这个改成 false 就可以了。

顺便,在上面还有一行配置:

@fontName          : 'Lato';

这个就是原来要从 google 引用的字体名称,可以把它改成自己想用的字体名(其实中文字体几乎没什么可选的,不就是雅黑宋体黑体楷体这几个么。。。)

关于自定义字体文件的方式,还没有研究过,中文字体一般也不考虑这种事情,字体文件太大了,遇到特殊情况再研究吧。

对了,修改完以后,记得 gulp build 拿到最新的编译文件。(此改动仅影响 css 文件,并不影响 js 文件)

修改 Semantic UI 中对 Google 字体的引用的更多相关文章

  1. Semantic UI中的验证控件的事件的使用

    1.Semantic UI中的验证控件,功能挺不错的,中文官网的文档写的都比较详细了,我再这里就不再进行重复了,主要是想说一下它的事件的使用方法,这个可能有部分朋友刚开始接触的时候不太了解 注意看这几 ...

  2. 修改 Semantic UI 的默认字体

    Semantic UI 默认使用的是谷歌提供的字体,并且是直接使用了谷歌的官方链接.由于大家都知道的原因,谷歌网站在国内访问速度很差,甚至根本无法访问,还有就是可能会在离线环境下使用 Semantic ...

  3. webpack 解决 semantic ui 中 google fonts 引用的问题

    semantic ui css 的第一行引用了 google web font api,由于不可告人而又众所周知的原因,这条链接在国内无法访问: @import url('https://fonts. ...

  4. 修改flex chart中Legend的字体样式

    最近在弄FLEX的图表, 发现CHART 中的Legend 的字体通过直接设置Style 并没有办法改变字体大小. google 了下, 发现了这个方法: 通过派生LegendItem类,并设置Leg ...

  5. Semantic UI基础使用教程

    自己今后要使用Semantic UI进行项目开发了,一步步的记录下来,供大家参考,也让自己去简单的学习一下,有空了就会更新一点东西,大家有什么问题可以相互交流一下,文采不是很好,希望大家要多多见谅,这 ...

  6. QT程序中显示中文字体解决办法

    Qt4.7.1 默认没有中文字体库,迅为给用户提供“文泉驿”字体和配置方法.本节需要的 文件在网盘: 用一个简单测试程序说明“文泉驿”字体的配置方法. 在 Qt Creater 新建工程“nihao” ...

  7. CSS在线字体库,外部字体的引用方法

    目录: 1:CSS家族五大字体 2:360和谷歌外部字体引用方法 3:谷歌外部字体引用方法详解 4:@font-face用法详解 一: {font-family:serif,sans-serif,fa ...

  8. CSS在线字体库,外部字体的引用方法@font-face

    @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,我们在Web的开发中使用字体不怕只能使用Web安全字体,你们当中或许有许 ...

  9. Eclipse中项目面板字体的修改

    修改eclipse安装目录中的如下文件,添加黄色标记部分,并设定自己需要的字体大小(这里是10px)即可: \eclipse\plugins\org.eclipse.ui.themes_1.1.1.v ...

随机推荐

  1. HTML拾遗

    一:标签 1:强调 <strong>加醋.<em>斜体 2:单独样式 <span>如果不加样式,那它包围的文字就是普通文字,可以在span中增加样式,就所包围的内容 ...

  2. java 将数字转成成16进制

      java 将数字转成成16进制 CreationTime--2018年6月11日17点11分 Author:Marydon 1.前提 数字必须是byte类型,即[-128,127] 2.代码实现 ...

  3. 〖Android〗屏幕触屏事件录制与回放

    需求: 不管是做自动化测试的,还是传媒技术的,自动化操作Android App是一种操作需求: 自动化的操作可以节省很多的人力资源投入: 实现: Android UI界面的自动化,通常有两个方法: 1 ...

  4. docker容器日志在哪?以及清理命令

    /var/lib/docker/containers 日志大小限制:传送门 查看所有容器日志大小和清理所有容器日志命令: ls -lh $(find /var/lib/docker/container ...

  5. Android webView打不开baidu网页的解决办法

    有时候会出现一些很奇怪的问题,比如,webview就是打不开百度网页,那么 加上这句就好了(备忘): WebSettings webSettings = webview.getSettings(); ...

  6. ext3, ext4 和 reiserfs 文件系统性能对比

    : 创建空文件10000个的耗时 创建小文件,每个小文件使用512个blocks,一共创建10000个 创建一个2G文件的耗时 复制2G文件的耗时 删除2G大文件的耗时 删除10000个小文件的耗时 ...

  7. IT软件外包行业深入分析:现状、前途、趋势、待遇 什么是软件外包 外包公司是怎么工作的 软件外包公司的面试 软件外包公司需要什么样的人

    目录: [0] - 为什么要对大学生谈软件外包? [1] - 什么是软件外包? [2] - 软件为什么要外包? [3] - 为什么要承接软件外包 [4] - 做软件外包有前途吗? [5] - 外包公司 ...

  8. Ubuntu菜鸟入门(十五)—— 安装aras2下载软件

    一.安装arias2 sudo add-apt-repository ppa:t-tujikawa/ppa sudo apt-get update sudo apt-get install aria2 ...

  9. sqlserver不太常见的,可能常见但又疑问的tsql语句

    2013年10月29日16:01:58 当数据有 time类型列时候,比如 打电话的通话时长,我们查询时候不方便,我们可以添加一个冗余列,直接统计秒 ,但是 后期知道的,现在我把例如 00:12:23 ...

  10. hihoCoder 1015 KMP算法(kmp)

    #1015 : KMP算法 时间限制:1000ms 单点时限:1000ms 内存限制:256MB 描写叙述 小Hi和小Ho是一对好朋友,出生在信息化社会的他们对编程产生了莫大的兴趣.他们约定好互相帮助 ...