耐人寻味的CSS属性font-family
2024-09-01 22:18:57
font-family是一个网站用户体验的第一入口，非常有必要花功夫来研究一下。我们首先需要了解衬线字体和无衬线字体，接着了解中英文的常用字体及其适用性。
衬线字体
衬线（serif）的笔画有粗有细的变化，在每一笔画上都自有风格，笔画末端会有修饰，强调艺术感，适合用于博客，旅游，文化，艺术类网站。
无衬线字体
无衬线（sans-serif）的字体工整方正，给人正式的感觉，适合政务类，企业类网站使用。
中文字体
Windows
simsun，宋体，也是windows下大部分浏览器的默认字体，font-size较大时清晰度不佳。Microsoft Yahei，无衬线字体，微软雅黑，是微软委托中国方正设计的一款中文字体。
Mac OS
STHeiti，华文黑体，OS X 10.6之前的简体中文系统界面默认字体，也是目前Chrome游览器下的默认字体。STXihei，华文细黑，比STHeiti文字更细。Heiti SC，黑体-简，从OS X 10.6开始，黑体-简代替华文黑体用作简体中文系统界面默认字体，显示效果不错，但是喇叭口设计遭人诟病。Hiragino Sans GB，冬青黑体，清新的专业印刷字体，小字号时足够清晰，拥有很多人的追捧。PingFang SC，苹方，在Mac OS X EL Capitan上，苹果为中国用户打造，去掉了为人诟病的喇叭口。
Linux
WenQuanYi Micro Hei，文泉驿微米黑，Linux最佳简体中文字体。
英文字体
Windows
Arial，无衬线西文字体，显示效果一般。Tahoma，无衬线字体，显示效果比Arial要好。Verdana，无衬线字体，优点在于它在小字上仍结构清晰端整、阅读辨识容易。
Mac OS
Times New Roman，衬线字体，Mac平台Safari下默认的字体。Helvetica、Helvetica Neue，被广泛使用。San Francisco，与苹方一样，mac os最新的西文字体。
font-family设置原则
- 西文优先：西文字体中大多不包含中文，西文优先，中文紧随其后，这样就不会影响到中文字体的选择。
- 从新到旧：优先体验最好的字体，向下兼容。
- 兼容多种操作系统：考虑
windows, mac os, android, linux等系统。 - 补充字体族：最后根据衬线
serif或无衬线sans-serif来补充字体族，当所有设置的字体都找不到时，让操作系统有选择字体的方向。
font-family推荐
font-family: "Helvetica Neue", Helvetica, "PingFang SC", Tahoma, "Hiragino Sans GB", "Heiti SC", Arial, "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
扫一扫下方小程序码或搜索Tusi博客，即刻阅读最新文章！
最新文章
- maven 配置
- Verilog学习笔记设计和验证篇(五)...............层次化事件队列
- 试用版SQL Server 2008 R2 提示评估期已过
- php防盗链,php ci在control里面控制除了自己站内的链接点击跳转，其他来源的都跳到站内页面
- X431 元征诊断枪
- 终极解决方案：windows10开机黑屏，死机
- ffmpeg显示视频
- Java---网络编程(2)-UDP
- SWT中的GridLayout（转）例子不错
- 项目管理实践【五】自动编译和发布网站【Using Visual Studio with Source Control System to build and publish website automatically】
- MOOS学习笔记2——HelloWorld回调
- Day4_生成器_三元表达式_列表解析_生成器表达式
- 《SQL CookBook 》笔记-第二章-查询结果排序
- 实习初步认识_1:部署renren-fast v2.0遇到的问题及解决方案
- LAMP环境配置安装注意安装步骤及说明事项
- python基础入门之函数基础
- NowCoder--牛可乐发红包脱单ACM赛C_区区区间间间
- php手撸轻量级开发（一）
- windows域控里，属性和字段映射表
- 关于池化（pooling）理解！！！