css - Chrome 中忽略的字体

Question

我在 Google Chrome 中遇到字体问题，我认为这是由 Windows 中的问题引起的。当我启动谷歌浏览器时，它会打开一个位于我硬盘上的网站。这是我自己制作的一个 HTML 网站，其中包含我最喜欢的所有网站。在 css 代码中，我选择 Dina 字体作为要显示的主要字体。直到上周左右一切正常，Chrome 以某种方式用标准的 Times New Roman 字体覆盖了 Dina 字体。

我检查了所有内容，但我不知道这是从哪里来的。 html 文件没有改变，奇怪的是 Firefox 和 Edge 也忽略了 Dina 字体。

安装字体是因为它在 Notepad++ 中工作。所以这似乎没什么问题。

我还在 css 中将 Dina 字体更改为 Arial 以查看是否有效，Chrome 确实显示了 Arial 字体，因此 css 脚本似乎没有任何问题。

字体链接:https://www.donationcoder.com/Software/Jibz/Dina/

我希望有人能帮助我在 Google Chrome 中再次显示 Dina 字体。

CSS代码:

a:link  {color: #d3d3d3 ; text-decoration: none; font-weight: normal;}
a:visited {color: #d3d3d3; text-decoration: none; font-weight: normal;}
a:active {color: #d3d3d3; text-decoration: none; font-weight: normal;}
a:hover {color: #FFFFFF; text-decoration: none; font-weight: normal;}
.td {vertical-align: top; width: 12%;} 
.table {width: 100%;}
.divInfo    {width: 100%; font-family: Dina; font-size : 14px; line-height: 20px; display:none; padding-left:5px;}
.text   {width: 100%; font-family: Dina; font-size : 14px; line-height: 20px; color : #d3d3d3; text-decoration : none; display : inline-block;}
.kop {width: 100%; font-family: Dina; font-size : 14px; line-height: 20px; color : #ff8000; text-decoration : none; font-weight: bold;}    

提前致谢!

Answer 1

尝试在 CSS 开头的某处添加以下内容:

@font-face {
  font-family: "Dina";
  src: url(https://www.donationcoder.com/Software/Jibz/Dina/...) format("truetype");
}

其中 https://www.donationcoder.com/Software/Jibz/Dina/... 是带有字体的文件的链接，扩展名为 .ttf或 .otf，或类似的，然后分别是 format("truetype") 或 format("opentype")。

所以基本上要确保字体链接正确。

TimesNewRoman 是默认字体系列，因此只要找不到您尝试使用的字体，就会使用它。