HTML和CSS基础..谷歌字体不工作？

Question

我似乎不知道我做错了什么。

我有。

<link href="https://fonts.googleapis.com/css?family=Spectral+SC" 
rel="stylesheet"type="text/css">


h1{ font-family: 'Spectral SC', serif;
}

.green-text{
color:rgb(0,255,0);
}

<h1 class=" text-center green-text">"Don't let anyone define you. You define 
yourself."</h1>

我使用的是codePen，它告诉我不需要包含'style‘，因为他们已经把它导入了。我的字体不工作，我做错了什么？？谢谢!

 Heres a link to a screenshot of my window...


[1]: https://i.stack.imgur.com/oQj42.png

Answer 1

问题是您在CodePen的CSS部分中编写HTML，这会使它混淆。

只需将<link>引用转到Google Font to HTML部分，就可以在我已经分享的中看到这一点。

这也可以在以下StackSnippet中看到：

​

h1 {
  font-family: 'Spectral SC', serif;
}

.green-text {
  color: rgb(0, 255, 0);
}

<link href="https://fonts.googleapis.com/css?family=Spectral+SC" rel="stylesheet" type="text/css">

<h1 class=" text-center green-text">"Don't let anyone define you. You define yourself."</h1>

​

请注意，当您转到使用您自己的站点时，您将需要添加另一个指向您自己的CSS文件的<link>标签，或者在<style>标签中编写您的CSS。

希望这能有所帮助！

Answer 2

将链接标记放在html文件中。根据屏幕截图，您已将其放置在css文件中。