css - 更改 Mat Select 的 Mat Option Font Family - Angular Material

Question

我正在尝试更改 mat-select 中选项的字体（“您出生在哪个城市”等）。

我注意到如果我将 ViewEncapsulation 设置为 none（例如，让样式从其他文件中渗入），它确实允许我更改字体系列，但是将其设置为 none 会导致其他不需要的样式渗入，即使我将这些都设置为“ ：主持人”

注意：当我在开发工具中更改此类的字体时，我注意到它成功更改了字体：

但是，当我将样式添加到我的 css 文件并尝试使用 ng-deep 时，它仍然不会更改字体。

Answer 1

将此添加到 Angular 项目中的 styles.css / styles.scss 文件中：

.mat-option-text {
  font-size: 16px !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
}