Web 开发字体设置最佳方案 - 文章教程

Web 开发字体设置最佳方案

发布于 2020-06-06 字数 2026 浏览 1665 评论 0

Web 开发字体设置最佳方案

字体设置

body {
    font-family: -apple-system, BlinkMacSystemFont,
    "PingFang SC","Helvetica Neue",STHeiti,
    "Microsoft Yahei",Tahoma,Simsun,sans-serif;
}

iOS 4.0+(iOS 9以下系统已经非常少) 使用英文字体 Helvetica Neue,之前的iOS版本降级使用 Helvetica。 中文字体设置为华文黑体STHeiTi。

iOS 9+ Safari开始支持 -apple-system 参数, Chrome 使用 BlinkMacSystemFont ,兼容 iOS / MacOS

微软雅黑 是为了兼容 Win 系统,毕竟视网膜分辨率的 win 系统用 Simsun 是非常丑陋的,可以用 4K 屏 windows 去看 JD 淘宝,你能忍的话我就没话说

PingFang SC 是简体苹方,看需要 如果要命中对应 苹方字体的话 直接写 PingFang 不带引号。

需补充说明,华文黑体并不存在iOS的字体库中,http://support.apple.com/kb/HT5484?viewlocale=en_US), 但系统会自动将华文黑体 STHeiTi 兼容命中系统默认中文字体黑体-简或黑体-繁:

Heiti SC Light 黑体-简 细体
Heiti SC Medium 黑体-简 中黑
Heiti TC Light 黑体-繁 细体
Heiti TC Medium 黑体-繁 中黑

原生 Android 下中文字体与英文字体都选择默认的无衬线字体。

4.0之前版本英文字体原生Android使用的是Droid Sans,中文字体原生Android会命中Droid Sans Fallback。

4.0+ 中英文字体都会使用原生Android新的Roboto字体。

其他第三方Android系统也一致选择默认的无衬线字体。

Android 就直接让它命中系统字体吧,因为你无法预知发行厂商会去内置什么字体,或者人家root去修改什么字体。

参考资料

如果你对这篇文章有疑问,欢迎到本站 社区 发帖提问或使用手Q扫描下方二维码加群参与讨论,获取更多帮助。

扫码加入群聊

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

目前还没有任何评论,快来抢沙发吧!

关于作者

JSmiles

生命进入颠沛而奔忙的本质状态,并将以不断告别和相遇的陈旧方式继续下去。

2891 文章
评论
84935 人气
更多

推荐作者

时光倒影

文章 0 评论

qq_YyjhCs

文章 0 评论

三人与歌

文章 0 评论

┼──瘾||

文章 1 评论