在拿到 UI 设计稿时,可以经常看设计稿中常见的字体有 PingFangSC-Regular、PingFangSC-Medium、PingFangSC-Bold,并不会直接给我们 font-weight
的值。在这我们就需要知道常见字体和 font-weight
的对应关系
Pingfang SC 有六个字重,设计师经常会用 Pingfang SC Medium 字体,大概很多人会忽略它,直接设 font-weight: bold
,但是对于 Pingfang SC 字体,设成 bold
其实变成了 Pingfang SC Semibold,Pingfang SC Medium 的字重是 500。
详细可以看 font-weight 的介绍 传送门
font-weight
属性执行字体中字形的重量,这取决于黑度等级或笔划粗细,其值的意义如下:
这些有序排列中的每个值,表示至少与其起身拥有相同黑度的重量。其大致符合下列通用重量名称:
- 100 - Thin
- 200 - Extra Light (Ultra Light)
- 300 - Light
- 400 - Regular (Normal、Book、Roman)
- 500 - Medium
- 600 - Semi Bold (Demi Bold)
- 700 - Bold
- 800 - Extra Bold (Ultra Bold)
- 900 - Black (Heavy)