css - 打印时 Microsoft Edge @font-face 不应用

Question

浏览网站时，所有字体均正常显示。打印页面时，预览和相应的输出都是 Times New Roman。这是我的 CSS 规则:

font-family: 'Metric-Regular';
src: url("fonts/MetricWeb-Regular.eot");
src: url("fonts/MetricWeb-Regular.woff") format("woff");

刚刚注意到这正在发生。该行为不会出现在任何版本的 IE、Firefox、Chrome 等中。我一直在搜索，但在打印时没有发现与此相关的任何事情，只是关于诸如 Edge 之类的事情尚不支持 woff2。

这里是正确渲染:

这是在打印预览中，这也是打印/另存为 PDF 的方式:

Answer 1

如果您尝试在@media print 中加载这些字体，那么它是 Edge 中的一个错误，目前不会被修复:

https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/10328179/

对我有用的解决方案是在@media print decleration 之外加载字体 - 如下所示:

@font-face {
    font-family: 'MyFont';
    src: url('../fonts/MyFont.ttf') format("truetype");
}

@media print {  

}