gpt4 book ai didi

css - Google 网络字体在初始页面加载时显示不正确的粗细

转载 作者:太空宇宙 更新时间:2023-11-04 12:00:31 26 4
gpt4 key购买 nike

我使用的是 Google 网络字体,在我网站的“head”部分链接如下:

<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,600,700">

我的客户正在使用 Safari 并报告以下行为:

  1. 当页面首次加载时,字体设置为“font-weight:300”比他们应该显示的更大胆。

  2. 当浏览器窗口缩小和重新缩放时,它会自行清理 上,并且字体以正确的粗细显示。

什么会导致初始状态?页面加载速度可能比从 Google 下载的三个权重 (300,600,700) 更快?

对于外部字体加载与本地 CSS 等相关的任何见解,我们将不胜感激。

最佳答案

如果您的 CSS 中未明确指定,默认字体粗细为 400(别名为“normal”),但您加载的字体没有粗细为 400 的变体(只有 300、600 和 700) .因此,在其 CSS 规则中使用此字体的任何元素也需要显式设置 font-weight: 300(或 600 或 700)以确保使用正确的权重变体。

(在 CSS2 spec 中记录了在没有字体粗细的情况下选择粗细的规则,从“按以下方式选择缺失的粗细”开始,因此甚至可能是 safari 有一个字体粗细查找错误这里)

关于css - Google 网络字体在初始页面加载时显示不正确的粗细,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29851371/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com