@font-face 和 @font-family 不起作用
我正在尝试做一些非常简单的事情：向 html 页面添加 3 种字体。
我看过大量的例子，但没有一个能解决我的问题。也许我在它的写作方式上缺少一些东西。我实际上不确定。
我的html：
<html>
<head>
<title>Fuentes</title>
<link type="text/css" rel="stylesheet" href="Fuentes.css">
</head>
<body>
<p class="a">This is a paragraph, shown in Roboto font.</p>
<p class="b">This is a paragraph, shown in Bellefair font.</p>
<p class="c">This is a paragraph, shown in the Kavivanar font.</p>
</body>
</html>
还有我的 .css：
@font-face {
font-family: "Roboto";
src: url(https://fonts.google.com/specimen/Roboto) format("truetype");
}
@font-face {
font-family: "Bellefair";
src: url(https://fonts.google.com/specimen/Bellefair) format("truetype");
}
@font-face {
font-family: "Kavivanar";
src: url(https://fonts.google.com/specimen/Kavivanar) format("truetype");
}
p.a {
font-family: "Roboto", Roboto, sans-serif;
}
p.b {
font-family: "Bellefair", Bellefair, sans-serif;
}
p.c{
font-family: "Kavivanar", Kavivanar, sans-serif;
}
这绝对不是如何使用 Google 字体......您甚至没有链接到实际字体，而是链接到支持页面。
<style>
@import url('https://fonts.googleapis.com/css?family=Roboto');
</style>
首先进入页面：https : //fonts.google.com/specimen/Roboto
然后点击这个：
然后它会在角落里创建一个小盒子。单击该框，您将看到此内容。现在你有了实际的代码：
