c# - 如何在 Index.razor 页面上为 Blazor 使用谷歌字体

@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 字体的正确方法是什么。

最佳答案

@ 用于为 Razor 代码添加前缀,因此您需要使用第二个 @ 对其进行转义。尝试:

 . . .
<style>
@@import url('https://fonts.googleapis.com/css2?family=Work+Sans');
 . . .

或者,如果您希望将其本地化到单个页面,请使用 CSS-Isolation :

  • 在与 Index.razor 相同的目录中创建一个 Index.razor.css 文件。
  • 这是一个“正常”的 css 文件,因此您可以像往常一样编写 css,而不必担心转义 @

https://stackoverflow.com/questions/68116682/

相关文章:

python - 在一行中将数​​字减半

c - 如果我想要一个全局 VLA,我可以在 main 函数中使用 alloca() 吗?

debugging - 在 WebStorm 中调试 hardhat solidity 测试

node.js - nvm:无法安装 v8.6.0,需要安装旧版本的 nodejs 无法安装,(ma

next.js - Next js中具有多个参数的动态路由 - 文件结构

awk - 列出唯一并计算字符串后的第一个数字匹配

css - 如何让 Elm 动画师使用 CSS 动画为 SVG 元素制作动画?

java - Kotlin Any 类型到 Java Object 类型

python - 如何从python中的嵌套列表中删除双引号

r - 使用 mutate 创建行而不是列