尝试加载 css 字体时出现 mime 类型错误
Posted
技术标签:
【中文标题】尝试加载 css 字体时出现 mime 类型错误【英文标题】：I get mime type error when attempting to load css fonts 【发布时间】：2021-07-16 20:33:29 【问题描述】：我加载了一个字体，当我保存文件时出现 mime 类型错误：
我不明白到底发生了什么。
这是html代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" src="Branda-yolq.ttf">
<title>Document</title>
</head>
<body>
<h1 id="welcomingText">Welcome to QUIZ</h1>
<button id="init-button">Start Quiz!</button>
<div class="contentDivDisplayed">
<p id='question'>question</p>
<span><input type="radio" autocomplete="off" name="hh"><p></p></span>
<span><input type="radio" autocomplete="off" name="hh"><p></p></span>
<span><input type="radio" autocomplete="off" name="hh"><p></p></span>
<span><input type="radio" autocomplete="off" name="hh"><p></p></span>
<p id="quest-num">questionNum</p>
<button id="next-button">Next</button>
</div>
<div id="alert-box"></div>
<script src="quiz.js"></script>
</body>
</html>
这是css代码：
@font-face
font-family: "skot";
src: url("Branda-yolq.ttf");
【问题讨论】：
【参考方案1】：此行导致问题：
<link rel="stylesheet" src="Branda-yolq.ttf">
你告诉浏览器加载一个样式表，但是你给它一个字体文件。这就是你得到 MIME 类型错误的方式。删除该行，错误应该消失。您已经在 css 中加载字体。
【讨论】：
以上是关于尝试加载 css 字体时出现 mime 类型错误的主要内容，如果未能解决你的问题，请参考以下文章
在 Exponent react-native 框架中使用 ShoutemUI/TextInput 组件时出现字体加载错误
CSS、.htaccess、资源解释为样式表，但使用 MIME 类型 text/html 传输