如果只是声明了字体族, font-family:Sans-serif,那会用这个族里的哪一款字体?

2016-05-14 10:50:20 +08:00
 rebeccaMyKid

另外一个问题,我想如果没有 font-family 的声明,或者说所有要求的字体我都没有,那么就应该按浏览器的内置设置来渲染字体了,就是所谓的 user-agent-stylesheet ,那这个顺序又是怎样的? 贴一张 Chrome 的字体设置图: http://i.imgur.com/ukbVYk4.png

3915 次点击
所在节点    问与答
5 条回复
caoyue
2016-05-14 12:32:27 +08:00
写了 font-family:Sans-serif 应该就是去找设置的 Sans-serif 字体了
如果设置的 Sans-serif 字体没有中文,那一般会去找系统默认的 fallback
但是 Chrome 可能会根据网页的 lang 属性来自己选择最后使用的字体
但是这个设置项没有出现在 Settings 中,只能安装扩展来查看或者修改

在开发者工具中选择 Styles Computed ,可以很方便的看到实际渲染使用的 Rendered Fonts
自己修改下样式做下测试也很简单
TimePPT
2016-05-14 14:11:22 +08:00
记得看过相关资料,一般来说 HTML 行间样式>样式表样式>浏览器用户自定义样式>浏览器默认样式>系统默认样式,字体样式也是按照这个顺序依此判断,如果当前层级指定字体没有,就像下一层级回退。另外,同一个样式表里字体样式会从左向右申请,所以一般西文字体最好写在中文字体前面,否则会一律按中文字体显示中西文。

以上不确定记得对不对,自己可以查下。
Khlieb
2016-05-15 08:40:45 +08:00
Chrome 的 Advanced Font Settings 扩展可以设置浏览器用户自定义样式
rebeccaMyKid
2016-05-15 21:49:23 +08:00
@caoyue 谢谢。我还有一个问题就是,是不是中文字体里面只会有中文,英文字体里只有英文?那比如说我查了一下谷歌的 font-family 是这样写的: font-family: arial,sans-serif; 那么,“这个页面的中文”是在哪个字体里找的? arial 字体里面包括中文吗?如果 arial 里面没有中文,那是不是就在在 sans-serif 里面找中文字体?还有我想知道方正雅黑这些中文字体大都是属于哪一族的?
caoyue
2016-05-16 11:11:46 +08:00
@rebeccaMyKid
对于字体我了解不多,你可以找找相关的文章看看,知乎上也有不少好答案=-=

1. 一般来说是英文字体只有英文,中文字体包含英文。但是还是看具体字体。

2. 对 Chrome 而言,你贴的图中的四个字体的设置,默认对应的是网页 lang=en 的情况
实际上, Chrome 隐含了单独对不同语言的这四个字体的设置,需要安装扩展来查看和修改(点那个高级字体设置就是

比如 在 lang=zh 的时候, Chrome 会根据这个隐藏的设置来寻找对应的 sans-serif 字体
这个时候可能 sans-serif 就对应的是微软雅黑

如果你安装了扩展,把 lang=zh 的设置下的 sans-serif 仍然修改为 Arial ,这个时候由于没有指定中文字体,浏览器寻找系统的默认 fallback ,比如在 Windows 上 Arial 中文部分可能就会 fallback 到 中易宋体

3. sans-serif 和 serif 应该是属于西文字体的分类方法,所以雅黑之类的中文字体一般不会应用这种分法,中文一般是按黑体,宋体等等这样分

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/278573

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX