角材料 - 如何更改某些元素的字体大小？答案

【问题标题】：Angular material - how to change font-size in some elements?角材料 - 如何更改某些元素的字体大小？
【发布时间】：2018-08-07 02:58:10
【问题描述】：

我使用 md-select 使用 Angular 4 和 Material，无论我尝试什么，我似乎都无法将 font-size 更改为 14。除了节点模块之外，也没有样式，我不想更改。我可以用firebug检查它，看到它是mat-select-trigger类将字体大小设置为16px，但我在任何地方都找不到它（节点模块内的某些文件除外）.....我怎么能将md-select字体大小改为14px还是12px？

【问题讨论】：

你能用 StackBlitz 重现这个问题吗？
复制太难了，我可能要上传所有依赖项，而且项目相当复杂，我猜。您认为我可以更改 node_modules 中的某些内容吗？我试图改变它里面的一些值，它起作用了，它解决了我的问题，但我知道它可能会被 npm 的每次更新覆盖。
您确实不应该更改 node_modules 中的代码。这是一个 md-select 的例子：stackblitz.com/edit/angular-material2-md-select-issue，这个例子你有同样的问题吗？
看来我设法通过将其添加到 src/styles/themes.scss 内的主题.scss（不在 node_modules 内）来更改它： .mat-select-trigger { font-size:14px; }

标签： angular angular-material2

【解决方案1】：

对我来说，添加一个重要的！标记，连同将所有这些放在 _common.scss 中，大多数情况下都可以解决问题。最后，我学会了这样做。如果这失败了，用 div 包装它并设置 div 的孩子的样式，保持重要！标记，并将此规则保存在 _common.scss 中。

【讨论】：

【解决方案2】：

您可以通过向您的 md-select 元素添加 css 声明来解决此问题，例如“custom-md-select”

然后，在您的主全局样式文件中，添加“.custom-md-select”，然后在此处添加您想要的新字体大小。

这是因为全局 css 适用于所有 CSS，与 CSS 的视图封装无关

【讨论】：