Angular 6材质对话框字体字体差异和材质图标大小修改

Question

我正在按照到目前为止所学到的材料设计来创建示例应用程序，但是我注意到材料设计的现成字体对于不同组件而言是不同的。对于材质对话框中的材质标题元素，标题以漂亮的Roboto字体显示，但材质对话框的内容以罗马字母显示：

这是我对话框的html组件：​​

<h3 mat-dialog-title>{‌{title}}</h3>
<mat-icon color="primary">error_outline</mat-icon>
<mat-dialog-content>
    <ul>
        <li *ngFor="let error of errorMessages">
          {‌{error}}
        </li>    
      </ul>
</mat-dialog-content>

我不想创建自定义样式，而是想直接使用与元素关联的默认样式。如果我添加

body {
  font-family: Roboto, Arial, sans-serif;
  margin: 0;
}

我的gobal styles.css修复了mat-dialog-content内容中的字体，但我不想这样做。

此外，该图标是如此之小，以至于您可以清楚地看到它们。有没有一种方法可以在运行时从图标库中选择更大的图标集？ 预先感谢！

Answer 1

看起来，我研究的唯一途径是在全局styles.css中定义body元素，如下所示：

 body {
  font-family: Roboto, Arial, sans-serif;
  margin: 0;
}