垫子列表材料角度5中的标题标签不起作用



>我遵循了 https://material.angular.io/components/list/api 但是对于标题,当标题标签级别更改时,我没有看到任何区别。将其更改为 h1、h2 等似乎不会改变字体大小。另外,我看到在示例中使用了mat-subheader,但在文档中称为matSubheader。我尝试了两种方法,但都没有奏效。请告知是否有人解决了它

<h3 matSubheader>Folders</h3>
<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]

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

我完全同意开箱即用的样式是......平淡无奇,因此您需要添加自己的;这不是一件可怕的事情。如果您希望 h1、h2、h3 在 mat-list 中的子标题中具有不同的大小或样式,您可以尝试如下操作:

.mat-subheader {
    font-size: 24px;
    color: green;
}
h2.mat-subheader {
    font-size: 20px;
}
h3.mat-subheader {
    font-size: 16px;
}

最新更新