材质图标在我的项目中没有正确渲染,我正确安装了,但即使没有在浏览器中显示。
我按照以下步骤操作:
npm install material-design-icons
..angular cli.json
"styles": [
"styles.css",
"../node_modules/material-design-icons/iconfont/material-icons.css"
],
app.module.ts
import {MatSidenavModule, MatToolbarModule, MatIconModule} from '@angular/material';
app.component.html
<mat-toolbar-row>
<span>Second Line</span>
<span class="example-spacer"></span>
<mat-icon class="example-icon">verified_user</mat-icon>
</mat-toolbar-row>
发布于 2018-04-19 23:00:09
我也有同样的问题。这是因为我在theme.scss中导入字体之前导入了材料主题。
应该是:
@import url( 'https://fonts.googleapis.com/css?family=Roboto:400,700|Material+Icons');
@import '~@angular/material/theming';
发布于 2019-02-22 22:25:13
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
确保已将其添加到您的index.html中。
发布于 2018-06-10 04:42:41
我已经制作了自己的文本字体!important
我不得不让图标变得更重要:
.lato * {
font-family: 'Lato' !important;
}
.mat-icon{
font-family: 'Material Icons' !important;
}
https://stackoverflow.com/questions/46632946
复制相似问题