Angular 应用程序中整体更改字体样式

Question

如何更改应用于整个Angular应用程序中使用的每个元素的“Font-Family”？

示例： 在CSS中：

p {
  font-family: Calibri, sans-serif
}

<p>Calibri</p>
<label>Default</label>

- Sakthivel A R

---

不确定我理解你的问题...你想设置一个全局的字体族吗？那就在全局样式表中进行设置，并将其添加到body中。 - Dom

是的。怎么做？ - Sakthivel A R

Answer 1

如果您正在使用第三方库，您需要使用ng-deep来访问和操作DOM元素。

在SCSS中：

::ng-deep body {
font-family: 'Calibri', sans-serif;
}

如果您没有第三方库，只需使用body标签。

在CSS中：

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

- envereren

---

我想在整个应用程序中使用相同的字体。 - Sakthivel A R

你可以在这里找到答案。试试如上所述的 root。链接 - envereren

@envereren 我有同样的需求，但是root没有帮助。当我使用*时，它起作用了，供你参考。 - ananth

Answer 2

font-family CSS属性指定了一个或多个字体系列名称和/或通用字体系列名称的优先级列表，用于选定的元素。

示例：

.testfont{
 font-family: 'Comic Sans MS',  sans-serif;
 }

<div class="testfont"> abcdefg (changed by class)</div>
<div class="default"> abcdefg (default cause not changed)</div>

注意：样式仅适用于您应用它的类。

要将其应用于每个元素，请在 body 中使用它：

body{
 font-family: 'Comic Sans MS',  sans-serif;
 }

<div class="testfont"> abcdefg (changed by body)</div>
<div class="default"> abcdefg (changed by body :D)</div>

- xKean

---

我想在整个应用程序中使用相同的字体。 - Sakthivel A R