如何更改字体样式

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/@字体

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;
}

然后，页面上的所有元素都将继承此字体家族(当然，除非您稍后覆盖它(。