网页使用思源字体 CSS
在知乎上再次看到这门字体的提问,想想中文字体过得多么艰辛,中文软件过得多么艰辛。
思源字体
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的更多相关文章
- Android中加入思源字体/NotoSansCJK/SourceHanSans
系统版本号:Android 4.2.2_r1 本文主要是在Android中加入思源字体的过程记录. 思源字体是Google和Adobe在2014.07.18公布的中文字体. 1.获取思源字体(Goog ...
- PHP计算思源字体宽度, 并把文字绘制到图片上
2019-6-19 9:18:54 星期三 思源字体是一套开源的字体, 那字体宽度是多少呢? 测试场景, 将包含汉字, 数字, 大小写字符的一段文字写到图片中去, 但不能出现超出的情况, 这就要计算 ...
- 详解CSS网页布局中默认字体样式
浏览器默认的样式往往在不同的浏览器.不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏 ...
- 网页引用本地电脑的字体 css设置浏览器会不显示的解决办法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 《网页设计基础——HTML注释与CSS注释》
网页设计基础--HTML注释与CSS注释 一.HTML注释: 格式: <!-- 在此处书写注释 --> 例如: <html> <head> <ti ...
- 向网页中写入js和css
向网页中写入js和css 本函数由前辈所写 loadFile: function (url, ftype) { var fileref; if (ftype == "js") { ...
- css3-11 网页如何使用自定义字体
css3-11 网页如何使用自定义字体 一.总结 一句话总结:下载好字体文件,然后在网页中引入,用src: url('my.otf');来引入,使用的时候就使用自己定义的名字来使用这个字体. 1.网页 ...
- Windows下自动云备份思源笔记到Gitee
前言 思源笔记是一款本地笔记为主的软件,其目前提供了148元/year的付费同步功能,但对于21世纪中国难民而言还是太贵啦. 条件允许的同学还是使用官方的同步,支持下作者. 所以,就在思考有没有白嫖的 ...
- 在CSS中通过@font-face属性来实现网页中嵌入特殊字体。
首先获取要使用字体的三种文件格式.EOT..TTF或.OTF..SVG,确保能在主流浏览器中都能正常显示该字体..EOT,适用于Internet Explorer 4.0+.TTF或.OTF,适用于F ...
随机推荐
- android:单位和尺寸
为了要让程序拥有更好的屏幕适配能力,在指定控件和布局大小的时候 最好使用 match_parent 和 wrap_content,尽量避免将控件的宽和高设定一个固定值.不过在 有些情况下,仅仅使用 m ...
- su 与 su - 比较
原文地址:http://blog.chinaunix.net/uid-25557346-id-2889329.html 今天有一同事说在切换用户的时候,找不到该用户下用户命令,后来仔细检查了一下过 ...
- Opencv中Mat矩阵相乘——点乘、dot、mul运算详解
Opencv中Mat矩阵相乘——点乘.dot.mul运算详解 2016年09月02日 00:00:36 -牧野- 阅读数:59593 标签: Opencv矩阵相乘点乘dotmul 更多 个人分类: O ...
- 在ASP.NET Core2.0中使用百度在线编辑器UEditor(转)
一.起因 UEditor是百度旗下的富文本编辑器,对于后端上传处理仅提供了Asp.Net 版的支持. 如果想在.Net Core项目中使用,那么后台上传接口需要重构. UEditorNetCore:百 ...
- Revit对齐工具之多重对齐
Revit对齐工具用来将一个或多个图元与选定图元对齐,比如建筑建筑时可以将梁.墙.柱等对齐到轴网,或者其它类似的图元的对齐,可以对齐同一类型的图元,或者不同类型族间的对齐,可以在二维视图.立面视图和三 ...
- 如何在Angular优雅编写HTTP请求
原文:https://segmentfault.com/a/1190000010570799 ----------------------------------------------------- ...
- grid - 网格线命名
通过grid-template-rows和grid-template-columns定义网格时,网格线可以被命名.网格线名称也可以设置网格项目位置. grid-template-rows和grid-t ...
- NuGet Package Explorer
https://www.microsoft.com/zh-cn/store/p/nuget-package-explorer/9wzdncrdmdm3?ocid=badge&rtc=1
- docker 安装hadoop
上一篇文章介绍了一些docker的基本命令,这篇文章来安装一个HADOOP 一.下载hadoop镜像 @~/git/github/docker-ambari (master)$ docker pull ...
- tmux 共享窗口大小
http://www.cnblogs.com/bamanzi/p/tmux-share-windows-between-sessions.html