css - Angular Material - 单选按钮标签字体大小太大

Question

正如您从这张图片中看到的，mat-radio 标签的字体大小与其他所有内容的字体大小相去甚远。

这是相关的模板部分:

<mat-radio-group formControlName="choice">
    <div class="col-auto">
        <mat-radio-button value="1">Ogni secondo</mat-radio-button>
    </div>
    <div class="w-100"></div>
    <div class="col-auto">
        <mat-radio-button value="2">Ogni</mat-radio-button>
        <mat-form-field>
           <mat-select formControlName="every">
              <mat-option *ngFor="let i of seconds" [value]="i + 1">
                 {{ i + 1 }}
              </mat-option>
           </mat-select>
        </mat-form-field>
        secondo/i partendo dal secondo
    ...

我已经尝试通过自定义排版，使用他们的 SASS 混入和函数，如排版文档部分所述。已经尝试过这意味着我尝试根据 https://material.angular.io/guide/typography 在 mat-core 导入中注入(inject)自定义排版

有什么想法吗？

编辑:为 .mat-radio-label-content 类设置自定义字体大小会产生以下结果:

Answer 1

您必须在 Material 的 CSS 本身中更改字体大小。你不能用写在你自己的 css 文件中的 css 覆盖它。