用 @font-face 来替换网页字体为啥无效呢，有木有大佬知道？

[MajestySolor]

这样写为啥无效呢，有大佬知道嘛

@font-face
{
  font-family: "宋体";
  src: local("Source Han Sans SC");
}

[YuxiangLuo]

src: local("Source Han Sans SC"); 的意思是加载用户电脑中安装好的 Source Han Sans SC，如果没装的话就不会生效。

还有 font-family: "宋体"; 这边写"宋体"会不会不太合适，因为大家都已经有了宋体，不知道重复定义会发生什么。换成"Siyuan"之类的会好一些。

正确的引入和使用方式大概是这样:
@font-face {
font-family: 'MyWebFont';
src: url('myfont.woff2') format('woff2'),
url('myfont.woff') format('woff');
}

body {
font-family: 'MyWebFont', sans-serif;
}

[DOLLOR]

多写几个别称，有的浏览器可能不认 Source Han Sans CN

@font-face{
font-family: "宋体";
src: local("Source Han Sans CN"),local("Source Han Sans CN Regular");
}

另外有的网站会指定雅黑，你可能需要把雅黑也覆盖掉
@font-face{
font-family: "microsoft yahei";
src: local("Source Han Sans CN"),local("Source Han Sans CN Regular");
}

[YuxiangLuo]

噢，我知道你要干什么了，当我没说。（狗头）

[MajestySolor]

@YuxiangLuo #1 感谢回复，你理解错了，我是想替换网页的字体
@DOLLOR #2 不是字体名的问题，而是这样写无效，但是我记得以前我在 firefox 上也这样干过是有效的，不知道是不是 chromium 自己的问题

[DOLLOR]

@MajestySolor
你一说我也发现了，chromium 家族的浏览器通过 @font-face 来替换字体，有一定概率会失效，得直接*{font-family: 字体名称了;}。

[noe132]

提一点，宋体不一定是宋体，有可能是 simsun nsimsun，serif 。你看看实际渲染的字体究竟是哪个。

[mxalbert1996]

有效啊
https://jsfiddle.net/mx_albert/cfe7mk3u/

[MajestySolor]

@mxalbert1996 #7 你是用什么浏览器有效？我这里 chromium 内核的都无效。

[MajestySolor]

https://codepen.io/Naushika/pen/ExjBwEy
各位可以测试一下，chromium 确实无效，好奇怪

[mxalbert1996]

@MajestySolor 这个 Dev Tools 看不出来是 Chrome 吗？我这样替换字体都用了多少年了。

[mxalbert1996]

顺便你那个链接我这里也没问题。

我建议你检查一下是不是你已经用了替换字体类的扩展导致冲突了。

[MajestySolor]

@mxalbert1996 #10 我表达错误，chrome 是正常的，只有 chromium 的 edge 无效 😄

[mxalbert1996]

@MajestySolor 我这里 Edge 也没问题。

[JamesR]

我也碰到这个问题了，捣鼓了一早上，谷歌浏览器本身问题，不识别你安装的字体，换别的浏览器（要清空缓存）正常。

[TPOB]

我也遇到这个问题了...可是我不想换浏览器（

[TPOB]

https://github.com/be5invis/Sarasa-Gothic/issues/115 我怀疑是这个问题，我用等线和雅黑都可以替换 @MajestySolor

[MajestySolor]

@TPOB #16 chromium edge 替换任何字体都无效，显然是浏览器自己的问题，同样的设置 Firefox 就一切正常

[TPOB]

@MajestySolor 我就是 chromium edge 呀，我换等线，雅黑，方正姚体，仿宋都可以，似乎是比较老的字体都行，新的都不行。可是我还是比较想用 sarasa 。。。

[moliyumi]

我也遇见这个问题了，解决方法：

进 chrome://flags/ 搜 font， 把（ Match @font-face { src: local(<name>) } names by PostScript and full font name ）这个 disabled 掉

我不知道这么做会不会有安全风险，请慎重

[MajestySolor]

@moliyumi #19 厉害了大佬，终于解决办法了 大拇指👍