当前位置: 首页 > Web前端 > CSS

耐人寻味的CSS属性font-family

时间:2023-03-30 15:16:35 CSS

font-family是网站用户体验的第一个入口,花时间去研究它是很有必要的。我们首先需要了解衬线字体和无衬线字体,然后了解中英文的常见字体及其适用性。Serif字体Serif(衬线体)笔划有粗有细,每一笔都有自己的风格,笔划末尾会进行修饰,以强调艺术感。适用于博客、旅游、文化、艺术类网站。Sansserif无衬线字体(sans-serif)字体工整方正,给人一种正式的感觉,适用于政务和企业网站。中文字体Windowssimsun和宋体也是Windows下大部分浏览器的默认字体。font-size大的时候,清晰度不好。微软雅黑,一种无衬线字体,是微软公司委托方正中国设计的中文字体。MacOSSTHeiti,中文黑体,OSX10.6之前简体中文系统界面默认字体,当前Chrome浏览器默认字体。STXihei,中文文字细黑,文字比STHeiti还要细。黑体SC,黑体简,从OSX10.6开始,黑体简体系统界面默认使用黑体字体代替中文黑体,显示效果不错,但喇叭口设计饱受诟病。HiraginoSansGB,冬青色的黑体,清新专业的印刷字体,小字号足够清晰,受到很多人的追捧。PingFangSC,Pingfang,苹果为中国用户打造的MacOSXELCapitan,去掉了被诟病的喇叭。Linux文泉驿微黑,文泉驿微黑,Linux下最好用的简体中文字体。英文字体WindowsArial,西文sans-serif字体,显示效果一般。Tahoma是一种无衬线字体,显示效果优于Arial。Verdana是一种无衬线字体,其优点是在小字体中仍具有清晰的结构,易于阅读和识别。MacOSTimesNewRoman,一种衬线字体,是Mac平台上Safari的默认字体。Helvetica,HelveticaNeue,被广泛使用。SanFrancisco和Pingfang一样,是macos最新的西文字体。font-family设置原则是西文优先:大部分??西文字体不包含中文,西文优先,中文紧随其后,这样不会影响中文字体的选择。从新到旧:先体验最好的字体,向后兼容。兼容多种操作系统:考虑windows、macos、android、linux等系统。补充字族:最后根据serif或sans-serif补充字族。当找不到所有设置的字体时,让操作系统选择字体的方向。font-family推荐字体系列:"HelveticaNeue",Helvetica,"PingFangSC",Tahoma,"HiraginoSansGB","HeitiSC",Arial,"MicrosoftYaHei","WenQuanYiMicroHei",sans-serif;扫描下方小程序码或搜索土司博客,第一时间阅读最新文章!