Angular Material 并不会自动为 HTML 文本元素应用文本样式,但你可以通过 CSS 或 Angular Material 提供的样式指令来实现。
以下是一种解决方法,使用 Angular Material 的样式指令 mat-typography
来应用文本样式:
styles.css
或 styles.scss
),添加以下代码:/* 根据需求选择合适的样式 */
body {
font-family: 'Roboto', sans-serif;
}
/* 应用 Angular Material 的文本样式 */
h1, h2, h3, h4, h5, h6, p, span, div {
@include mat-typography;
}
这是一个标题
这是一段文本内容。
这是一个小标题。
在上面的示例中,mat-display-1
、mat-body-1
和 mat-caption
是 Angular Material 提供的文本样式类名,它们会应用不同的字体大小、行高和字重等样式。
通过以上步骤,你可以使用 Angular Material 提供的样式指令 mat-typography
来为 HTML 文本元素应用文本样式。请根据你的需求选择合适的样式类名,并在适当的元素上应用。