如何在<ion-tab></ion-tab>中使用字体图标
我想做的是:
<ion-tabs>
<ion-tab [root]="tab1Root" class="fa fa-calculator" tabTitle="Home" ></ion-tab>
<ion-tab [root]="tab2Root" tabTitle="About" tabIcon="fa-calculator"></ion-tab>
<ion-tab [root]="tab3Root" tabTitle="Contact" tabIcon="contacts"></ion-tab>
</ion-tabs>发布于 2017-11-01 13:10:36
这里是我添加字体的解决方案,非常棒的 <ion-tab></ion-tab>
注意:确保你在你的离子项目中安装了正确的字体。
your-example.html
<ion-tabs tabsPlacement="top" >
<ion-tab [root]="tabAlgorithms" tabTitle="Algorithms" tabIcon="fa-sitemap" ></ion-tab>
</ion-tabs>your-example.scss
.fa-icons-general {
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
transform: translate(0, 0);
}
.ion-ios-fa-sitemap::before,
.ion-ios-fa-sitemap-outline::before,
.ion-md-fa-sitemap::before {
@extend .fa-icons-general;
content: "\f0e8";
}希望这能解决你的问题。
https://stackoverflow.com/questions/42747846
复制相似问题