今天有朋友在开发中,问到了网页字体的问题,以前虽然用过,但是没有什么深入的研究,这次刚好整理一番,给大家分享一下.
字体,在网页开发中一直扮演着很尴尬的地位,大部分时间,默认字体都可以满足我们的需要,但是有时候,为了增加美感,我们也会用一些特殊的字体,比如我以前写过一个网页,用到了一种很美的字体.如图:
是不是很好看.然而,这个字体是引用的字体包,系统自带的字体是没有这个的.而有时候,我们一个页面,只有几k,但是汉字的字体包一般都很大,有几MB,那么我们有没有办法依靠操作系统的预装字体来尽量让页面看着好看呢.这就要我们先了解系统预装字体的种类.
系统的预装字体,不同的操作系统,预装字体不一样
Windows操作系统
黑体:SimHei
宋体:SimSun
新宋体:NSimSun
仿宋:FangSong
楷体:KaiTi
仿宋GB:FangSongGB
楷体GB:KaiTiGB
微软雅黑:MicrosoftYaHei(Windows7开始提供)
OSX操作系统冬青黑体:HiraginoSansGB(SNOWLEOPARD开始提供)
华文细黑:STHeitiLight(又名STXihei)
华文黑体:STHeiti
华文楷体:STKaiti
华文宋体:STSong
华文仿宋:STFangsong
如果用户装了MicroSoftOffice,还会多出一些字体。
隶书:LiSu
幼圆:YouYuan
华文细黑:STXihei
华文楷体:STKaiti
华文宋体:STSong
华文中宋:STZhongsong
华文仿宋:STFangsong
方正舒体:FZShuTi
方正姚体:FZYaoti
华文彩云:STCaiyun
华文琥珀:STHupo
华文隶书:STLiti
华文行楷:STXingkai
华文新魏:STXinwei
安卓手机端字体
默认中文字体:Droidsansfallback
默认英文和数字字体:DroidSans
苹果手机端字体
默认中文字体:HeitiSC
默认英文字体:Helvetica
默认数字字体:HelveticaNeue
注:各个手机系统有自己的默认字体,且都不支持微软雅黑如无特殊需求,手机端无需定义中文字体,使用系统默认英文字体和数字字体可使用Helvetica,三种系统都支持
*移动端定义字体的代码*/body{font-family:Helvetica;}
对于这些系统字体我们可以这样用:font-family:YouYuan,"FZShuTi","微软雅黑";
对于font-family它的规则有三条。
(1)优先使用排在前面的字体。
(2)如果找不到该种字体,或者该种字体不包括所要渲染的文字,则使用下一种字体。
(3)如果所列出的字体,都无法满足需要,则让操作系统自行决定使用哪种字体。
上面说的是使用系统的预装字体,如果我们用的是字体包又该如何使用呢?如图:
赞赏