为什么要在 shadow DOM 之外的全局范围内声明 @font-face？答案

【问题标题】：Why should @font-face be declared at global scope, outside of shadow DOM?为什么要在 shadow DOM 之外的全局范围内声明 @font-face？
【发布时间】：2021-07-27 05:43:02
【问题描述】：

根据经验，我知道 @font-face 应该在影子 DOM 之外的全局范围内声明，但是，我找不到任何关于它的规范。任何人都可以提供合理来源或文档/规范的解释吗？

我知道有很多类似的问题和答案，但 AFAIK 没有一个真正提供任何官方参考。

【问题讨论】：

这是您问题的答案吗？ css-tricks.com/regarding-css-global-scope
@font-face 可以在conditional group rule 中声明，例如@media 和@supports，而不仅仅是在全局范围内。我没有听说过影子 DOM 的限制。
@ErfanBahramali 它没有给我想要的答案，但感谢您的帮助。
@HereticMonkey 我在这里不是在谈论规则级别的范围，而是更可能是全局影子 DOM 级别的范围。如果您尝试在 shadow DOM 中使用 @font-face 加载字体，无论您在 @media 或 @supports 中加载字体（至少在最新的 Chrome 上），它都不会加载。我们不同意这个问题的存在正是我问这个问题的原因。说明这一点的规范在哪里？在 w3.org、mozilla 等上找不到任何文档。希望您能带回证据，我将不胜感激；）
求源：github.com/WICG/webcomponents/issues?q=is%3Aissue+font-face

标签： html css font-face shadow-dom

【解决方案1】：

截至 2021 年 5 月，它仍然是一个公开草案。整个讨论可以在这里找到：https://github.com/w3c/csswg-drafts/issues/1995

【讨论】：