@page "/"
<style>
@import url('https://fonts.googleapis.com/css2?family=Work+Sans');
body {
margin: 0;
font-family: 'Work Sans';
color: #4d4d4d;
}
</style>
在 React.js 中,我可以简单地使用 @import 来使用标签来使用 Google 字体,但是在 Blazor 中,我收到了错误 The name 'import' does not exist in current context
。为 Blazor 应用全局使用 Google 字体的正确方法是什么。
答案 0 :(得分:2)
在 blazor 中,添加字体比 reactjs 稍微复杂一些。
@font-face {
font-family: '<FONT-FAMILY>';
src: url('../fonts/<FONT.WOFF>');
}
将 FONT.WOFF
替换为您的字体名称,将 FONT-FAMILY
替换为您正在使用的字体系列的名称!我是从 this blog
答案 1 :(得分:2)
@
用于作为 Razor 代码的前缀,因此您需要使用第二个 @
对其进行转义。试试:
. . .
<style>
@@import url('https://fonts.googleapis.com/css2?family=Work+Sans');
. . .
或者,如果您希望将其本地化为单个页面,请使用 CSS-Isolation:
@
。