【CSS】font-weight设置为500显示不出加粗效果

文章讨论了MacOS和Windows操作系统中默认字体(STHeiti和宋体)在CSS中设定字体粗细时的回退机制,特别强调了当矢量级别不足时,如何根据预设规则选择最接近的可用精度。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

问题出在操作系统上:
  • macOS 系统默认的华文黑体(STHeiti) 有七个矢量级别:Heavy/Bold/MediumP4/Regular/Thin/Light/UltraLightP2 ,它包含上面 CSS 中设定的 500 这个精度。

  • Windows 系统默认的宋体(simsun) 没有那么多级别。在缺少级别支持的前提下,CSS 会根据回退机制寻找一个类似的精度,结果就变成了400 (Normal)。


回退机制:
  • 如果指定的权重值不可用,则使用以下规则来确定实际呈现的权重:
  1. 如果指定的权重值在 400和 500之间(包括400和500):
    1. 按升序查找指定值与500之间的可用权重;
    2. 如果未找到匹配项,按降序查找小于指定值的可用权重;
    3. 如果未找到匹配项,按升序查找大于500的可用权重。
  2. 如果指定值小于400
    1. 按降序查找小于指定值的可用权重
    2. 如果未找到匹配项,按升序查找大于指定值的可用权重(先尽可能的小,再尽可能的大)。
  3. 如果指定值大于500
    1. 按升序查找大于指定值的可用权重
    2. 如果未找到匹配项,按降序查找小于指定值的可用权重(先尽可能的大,再尽可能的小)。
  • 以上策略意味着,如果一个字体只有 normal 和 bold 两种粗细值选择,指定粗细值为 100-500 时,实际渲染时将使用 normal,指定粗细值为 501-900 时,实际渲染时将使用 bold 。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Coder Ben

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值