在知乎上再次看到这门字体的提问,想想中文字体过得多么艰辛,中文软件过得多么艰辛。

思源字体

2014年7月,Adobe与Google宣布推出一款新的开源字体思源黑体, 有七种字体粗细(ExtraLight、Light、Normal、Regular、Medium、Bold 和 Heavy),完全支持日文、韩文、繁体中文和简体中文,还包括来自 Source Sans字体家族的拉丁文、希腊文和西里尔文字形。

至于为什么是叫这个名字就变得不是很重要,只是让人有预感,很快这些字体将会无处不在。

  • Android自带的字体难看
  • Adobe Reader很受欢迎

So,这两家公司会在自家的产品上用上这些字体。

下载地址:

Adobe思源: http://sourceforge.net/projects/source-han-sans.adobe/

Google Noto: http://www.google.com/get/noto/

思源字体 CSS

考虑到我姐给我的建议是首页换一个厚重点的字体,于是就换吧。

在网上搜了一下,下了一个然而和官方的似乎是不一样的,官方的font-family应该是Source Han Sans CN。于是我们的CSS代码就出来了

font-family: "Source Han Sans CN"

将之放在首页上的字体。

如果是谷歌的Noto的话

font-family: "noto sans"

简单的对比一下

原来的字体结果如下所示

<img alt="原文字" src="/static/media/uploads/screen_shot_2014-07-28_at_13.53.51.png" width="600"/>

新的字体,看词的正文

<img alt="思源文字" src="/static/media/uploads/screen_shot_2014-07-28_at_13.53.42.png" width="600"/>

似乎看起来还不错的样子。

其它

可惜的是没有Web Font在当前,要不就爽了,中文的Web Font,

网页使用思源字体 CSS的更多相关文章

  1. Android中加入思源字体/NotoSansCJK/SourceHanSans

    系统版本号:Android 4.2.2_r1 本文主要是在Android中加入思源字体的过程记录. 思源字体是Google和Adobe在2014.07.18公布的中文字体. 1.获取思源字体(Goog ...

  2. PHP计算思源字体宽度, 并把文字绘制到图片上

    2019-6-19 9:18:54 星期三 思源字体是一套开源的字体, 那字体宽度是多少呢? 测试场景, 将包含汉字, 数字, 大小写字符的一段文字写到图片中去, 但不能出现超出的情况,  这就要计算 ...

  3. 详解CSS网页布局中默认字体样式

    浏览器默认的样式往往在不同的浏览器.不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏 ...

  4. 网页引用本地电脑的字体 css设置浏览器会不显示的解决办法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 《网页设计基础——HTML注释与CSS注释》

    网页设计基础--HTML注释与CSS注释       一.HTML注释: 格式: <!-- 在此处书写注释 --> 例如: <html> <head> <ti ...

  6. 向网页中写入js和css

    向网页中写入js和css 本函数由前辈所写 loadFile: function (url, ftype) { var fileref; if (ftype == "js") { ...

  7. css3-11 网页如何使用自定义字体

    css3-11 网页如何使用自定义字体 一.总结 一句话总结:下载好字体文件,然后在网页中引入,用src: url('my.otf');来引入,使用的时候就使用自己定义的名字来使用这个字体. 1.网页 ...

  8. Windows下自动云备份思源笔记到Gitee

    前言 思源笔记是一款本地笔记为主的软件,其目前提供了148元/year的付费同步功能,但对于21世纪中国难民而言还是太贵啦. 条件允许的同学还是使用官方的同步,支持下作者. 所以,就在思考有没有白嫖的 ...

  9. 在CSS中通过@font-face属性来实现网页中嵌入特殊字体。

    首先获取要使用字体的三种文件格式.EOT..TTF或.OTF..SVG,确保能在主流浏览器中都能正常显示该字体..EOT,适用于Internet Explorer 4.0+.TTF或.OTF,适用于F ...

随机推荐

  1. 461.汉明距离(c++实现)

    问题描述: 两个整数之间的汉明距离指的是这两个数字对应二进制位不同的位置的数目. 给出两个整数 x 和 y,计算它们之间的汉明距离. 注意:0 ≤ x, y < 231. 示例: 输入: x = ...

  2. 290.单词模式。给定一种 pattern(模式) 和一个字符串 str ,判断 str 是否遵循相同的模式。(c++方法)

    题目描述: 给定一种 pattern(模式) 和一个字符串 str ,判断 str 是否遵循相同的模式. 这里的遵循指完全匹配,例如, pattern 里的每个字母和字符串 str 中的每个非空单词之 ...

  3. asp.net mvc Session RedisSessionStateProvider锁的实现

    最近项目用到了RedisSessionStateProvider来保存session,发现比内存session慢,后来慢慢了解,发现asp.net session是有锁的.我在文章 你的项目真的需要S ...

  4. [Docker] Benefits of Multi-stage Builds

    The benfits of multi-stage builds: Avoid manual creation of intermediate images Reduce complexity Se ...

  5. [JS]两个常用的取随机整数的函数

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  6. Eclipse 插件开发 -- 深入理解菜单(Menu)功能及其扩展点( FROM IBM)

    Eclipse 插件开发 -- 深入理解菜单(Menu)功能及其扩展点 菜单是各种软件及开发平台会提供的必备功能,Eclipse 也不例外,提供了丰富的菜单,包括主菜单(Main Menu),视图 / ...

  7. toml

    其目标是成为一个小规模的易于使用的语义化配置文件格式.TOML被设计为可以无二义性的转换为一个哈希表(Hash table). # 这是一个TOML文件 title = "TOML Exam ...

  8. win32 进程崩溃时禁止弹出错误对话框

    在程序初始化的时候加入以下代码即可: SetErrorMode(SEM_FAILCRITICALERRORS | SEM_NOGPFAULTERRORBOX);    _set_abort_behav ...

  9. 【Android】解析Android的路径

    目录结构: contents structure [+] 内部路径 外部路径 Assets目录 Android中的路径主要分为内部路径和外部路径. 一.内部路径 常见的内部存储路径有: File f1 ...

  10. (转)PyCharm报错:“No R interpreter defined: Many R……”——解决办法

    报错截图: 下载安装链接:The Comprehensive R Archive Network