浏览器如何通过font

浏览器如何通过font-family值获取正确的字体文件？(How does browser pickup the right font file via font-family value?)

我将一些新的字体文件，Apple的PingFang文件，许多.ttf文件复制到我的CentOS / usr / share / fonts目录，并通过命令fc-cache -fv重建字体缓存，看起来很成功。 但是当我运行fc-match'PingFang'时，结果不是新安装的字体文件。 有什么事？

另一个相关的问题是，对于Apple的PingFang家族，有很多文件，如PingFang Bold.ttf PingFang ExtraLight.ttf PingFang Heavy.ttf PingFang Light.ttf PingFang Medium.ttf PingFang Regular.ttf，每个文件的正确姓氏是什么字体文件，如果我想使用特定的字体文件的浏览器渲染？

I copied some new fonts files , Apple's PingFang files, many .ttf files, to my CentOS /usr/share/fonts dir and rebuild the font cache via command fc-cache -fv , it seems success. But when I run fc-match 'PingFang', the result is not the newly installed font file. What is the matter?

Another related question is , for the Apple's PingFang family , there are many files, like PingFang Bold.ttf PingFang ExtraLight.ttf PingFang Heavy.ttf PingFang Light.ttf PingFang Medium.ttf PingFang Regular.ttf, what is the right family name for each font file if I want the browser render using specific font file?

最满意答案

要在css中放置本地.ttf字体并指定系列中的粗体，中等或任何样式，其中font-family是指定权重的别名：

@font-face { font-family: "PingFang"; src: url("PingFang-Medium.ttf") format('truetype'); }

For putting a local .ttf font in your css and specifying bold, medium, or whatever style in the family, where font-family below is the alias of the specified weight:

@font-face { font-family: "PingFang"; src: url("PingFang-Medium.ttf") format('truetype'); }