为什么@font-face 在此代码段中不起作用？

Question

当我尝试使用font-face时，它什么也不做，也不会改变字体。 为什么它不起作用？ 这是我的 HTML 代码

<!DOCTYPE html>
<html lang="de">

    <head>
        <meta charset="utf-8">
        <title>Test</title>
        <link rel="stylesheet" type="text/css" href="schriftarten.css">
    </head>

    <body>
        <span id="span1">Hallo Welt</span>
    </body>

</html>

这是我的 CSS 代码：

@font-face {
  font-family: "Test";
  src: url("Anton-Regular.ttf") format("ttf");
  font-style:normal;
}

#span1{
  background-color:orange;
  font-size:30px;
  font-family:Test;
}

我究竟做错了什么？ 我使用的是 Chrome 版本 84.0.4147.135（Offizieller Build）（64 位）

Answer 1

您需要使用所有类型的字体来匹配所有浏览器标准，这里是一个示例，让您了解您的 css 代码：

@font-face{
font-family:YOUR_FONT_NAME;
src:url('YOUR_FONT_NAME.eot');
src:url('YOUR_FONT_NAME.eot?#iefix') format('embedded-opentype'),url('YOUR_FONT_NAME.woff') format('woff'),url('YOUR_FONT_NAME.ttf') format('truetype'),url('YOUR_FONT_NAME.svg#weberdsBold') format('svg');

}

Answer 2

我刚刚找到了解决方案。 当我删除它时，错误是格式（“ttf”），很好

为什么@font-face 在此代码段中不起作用？

问题描述

2 个解决方案

解决方案1
0 2020-08-26 20:35:48

解决方案2
0

为什么@font-face 在此代码段中不起作用？

问题描述

2 个解决方案

解决方案1 0 2020-08-26 20:35:48

解决方案2 0

解决方案1
0 2020-08-26 20:35:48

解决方案2
0