如何在CSS文件中调用Google API字体？

Question

<link href="https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900" rel="stylesheet">

如何在CSS文件中调用上述Google字体系列链接？

Answer 1

使用导入方法

@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900');
#p{
  font-family: 'Montserrat', sans-serif;
}

<p id="p">Sample text</p>
<p>Sample text</p>

Answer 2

在css文件中使用 @import 。

更好将链接放在您的html头中，@import按顺序加载，最好避免

＆＃13;

＆＃13;

@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900');
body, html{
  font-family: "Montserrat";
}

＆＃13;

<h1>Font Face</h1>

＆＃13;

＆＃13;

＆＃13;

Answer 3

您必须使用@import：

@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900');

Answer 4

您可以从Google字体列表中选择字体。选择所需字体后，您可以按＆＃34;（x）系列选择＆＃34;页面底部的面板。像@import这样的好例子。

导入必须始终是CSS文件的第一件事，否则它无法正常工作。

Answer 5

只需将以下代码放入css

即可

@import url（'https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900'）;

你可以在这里看到DEMO

[1]: https://jsfiddle.net/tanmndz/e3djLnn2/