如何在 React 中将谷歌字体添加到 CSS

在 React 应用程序中，我们可以使用 @import 声明将谷歌字体添加到我们的 CSS 中。

步骤

1. 打开谷歌字体网站 https://fonts.google.com/，浏览并选择你喜欢的字体

2. 点击 "Select This Font" 按钮，选择字体样式

3. 点击 "Embed" 按钮， 复制 @import 语句。

4. 在 React 中的 CSS 文件中，添加 @import 语句和字体名称，例如：

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');

body {
  font-family: 'Roboto', sans-serif;
}

在这个例子中，我们添加了 Roboto 字体，并将 font-family 属性设置为 'Roboto', sans-serif。

5. 保存并将更改部署到你的应用程序。

结论

使用这个方法，你可以很容易地将谷歌字体添加到你的 React 应用程序中。在选择字体时，确保选择权威的、有良好排版的字体，并遵循版权规定。