如何更改字体样式？

Question

我想更改我商店的所有字体。 我发现这段代码可以帮助我进行更改。 我需要在哪里实施？我是否需要更改其他代码字符串才能使其正常工作？

@font-face {
    font-family: GothamBlack;
    src: url(https://github.com/JDRF/design-system/blob/master/dist/fonts/gotham/black/gotham-black-webfont.woff); 
}

Answer 1

您必须将此规则放在样式表中，并使用font_family作为选择器。

添加到样式表后，该规则会指示浏览器从托管位置下载字体，然后按照CSS中的指定显示字体。

例如：

Css部分：

@font-face {
    font-family: GothamBlack;
    src: url(https://github.com/JDRF/design-system/blob/master/dist/fonts/gotham/black/gotham-black-webfont.woff); 
}

body {
    font-family: GothamBlack, sans-serif;
}

如果body无法使用GothamBlack，则它使用sans-serif。

有关更多信息：

https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face

https://css-tricks.com/snippets/css/using-font-face/

https://www.w3schools.com/cssref/css3_pr_font-face_rule.asp

Answer 2

将font-family声明放入正文选择器中：

@font-face {
    font-family: GothamBlack;
    src: url(https://github.com/JDRF/design-system/blob/master/dist/fonts/gotham/black/gotham-black-webfont.woff); 
}

然后

body {
  font-family: GothamBlack;
}

页面上的所有元素随后都将继承此字体系列（除非，当然，您稍后会覆盖它）。