CSS字体属性全解析

2020-05-05 07:33:57易采站长站整理

可以分为三类:关键字属性,包括normal 、bold 两个;相对关键字属性,它的粗细是相对于从上级父元素的继承值而言的,包括bolder和lighter两个;数字属性,包括从“100”到“900”的9个数字序列(只能是100的整数倍)。这个数字序列表示从最细(100)到最粗(900)的字体粗细程度。
可用值      属性值的说明

normal      缺省值。正常字体显示。
bold        粗体
bolder      相对于父元素稍粗
lighter     相对于父元素稍细
100         至少和200一样淡
200         至少和100一样粗,至少和300一样淡
300         至少和200一样粗,至少和400一样淡
400         字体正常显示,相当于normal
500         至少和400一样粗,至少和600一样淡
600         至少和500一样粗,至少和700一样淡
700         粗体,相当于bold
800         至少和700一样粗,至少和800一样淡
900         至少和800一样粗

字体粗细属性是根据用户电脑上安装的字体作相应匹配显示的。很多情况下,由于系统作了最相近的匹配,从显示效果上很难看出不同的 font-weight值的区别。对于种类繁多花样百出的字体而言,目前并没有一个统一的规则标明粗细的程度。有的字体名称本身就能描绘粗细程度,如Arial Bold字体显示本身就比Arial粗不少,像这样的字体名称的主要作用就是在单个字体集中区别字体的粗细程度。
如果某种字体集中已使用了9级数值的范围(如OpenType一样),字体的粗细应该直接与9级数值相匹配。如果一种字体同时拥有Medium、Book、Regular、Roman或者Normal的字体集名称,Medium通常分配为“500”,其他4个分配为“400”。如果字体集中有标记为“bold”的名称,相当于数值“700”。如果字体集中少于9级粗细级别,参照缺失填补方式的规定。有了以上匹配方式,对于“bolder”和“lighter”的匹配也不难理解。“bolder”就是匹配字体集中可用的下一级较粗字体,反之“lighter”也是一样,匹配下一级较细字体。它们的参照系都是继承值,因此粗细程度都是相对于继承值而言的。

如果字体集中少于9级粗细度算法,那么填补缺失的方法如表所示:

填补填补缺失的方法