Question

我跟着https://material.angular.io/components/list/api但是对于标题我没有看到标题标记级别更改时有任何差异。将其更改为h1，h2等似乎不会更改字体大小。另外，我看到mat-subheader在示例中使用，但在文档中称为matSubheader。我试过了两次，但都没有奏效。 Plz建议是否有人解决了它

<h3 matSubheader>Folders</h3>

Answer 1

<mat-list *ngFor="let e of emp; let i = index">
  <h3 mat-subheader>{{e.prefix}}</h3>
  <mat-list-item *ngFor="let employees of e.employee; let j = index ">
      <h4 mat-line>{{employees.name}}</h4>
  </mat-list-item>
</mat-list>[enter image description here][1]

Answer 2

当您将matSubheader 属性应用于HTML元素时，angular指令将自动应用mat-subheader CSS类。使用matSubheader属性是调用功能的适当方法。如果使用h1，h2或h3则没有任何区别的原因是因为Angular Material确实对该类应用了某些样式，包括字体大小，颜色，粗细等，因此这无关紧要如果将属性粘贴在h3，h1或div上，则文本将始终看起来相同。

我完全同意，这种开箱即用的样式令人难以理解，因此您需要添加自己的样式。这不是一件可怕的事情。如果您希望h1，h2，h3在子列表中作为子标题时具有不同的大小或样式，则可以尝试以下操作：

.mat-subheader {
    font-size: 24px;
    color: green;
}

h2.mat-subheader {
    font-size: 20px;
}

h3.mat-subheader {
    font-size: 16px;
}

mat-list材料中的标题标签angular5不起作用

2 个答案: