问题：当我下载谷歌字体时，CSS可以在使用macOS时检测字体。CSS无法在VPS Ubuntu 20.04 LTS上看到使用相同代码的字体。如果我使用@import从谷歌获得字体链接，那么CSS可以在这两种情况下看到字体(即，在macOS和VPS Ubuntu上都可以看到)。我不想使用链接；我想把字体放在我的VPS硬盘上。
<!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">
<title>My HTML Test</title>
<style>
/*
@import url('https://fonts.googleapis.com/css2?family=Updock&display=swap');
*/
@font-face {
font-family: 'Updock';
src: url('/Updock/Updock-Regular.ttf');
}
.myFont {
font-family: 'Updock';
}
.defaultFont {
font-family: cursive;
}
.myFirstLetter::first-letter {
font-size: 200%;
color:red
}
</style>
</head>
<body>
<div class="myFont">
<h1>This Is My Font!!</h1>
</div>
<div class = "defaultFont, myFirstLetter">
<h1>This Is Default Font!</h1>
</div>
</body>
</html>
字体文件的目录路径正确。我在VPS上使用了相同的目录名和路径，这在macOS上很成功。
试着把它放在你的VPS机器上，放在.htaccess文件中：
<IfModule mod_mime.c>
AddType application/x-font-ttf .ttf
</IfModule>
请确保已安装mod_mime模块。此外，请检查此答案：更正字体MIME类型的Apache AddType指令