2

我在许多屏幕上都面临这个图标问题。例如。我有一个屏幕，我在导航栏的左侧添加了一些图标。但它根本没有显示图标。仅显示小后箱。这是我的代码：

 <ion-buttons>
    <button ion-button >
        <ion-icon name="close"></ion-icon>
      </button>
       </ion-buttons

我也用这个：

 <ion-buttons>
        <button ion-button >
<ion-icon ios="ios-close" md="md-close"></ion-icon>
 </button>
           </ion-buttons

但没有用。仍然显示黑色小框图标。

好的，现在我尝试使用推送导航。但是它没有显示后退按钮。这是我的代码：

我的 home.html ：

  <button class="button button-outline footerbtnone" (click)="login()">LOG IN</button>

我的家.js

 constructor(public navCtrl: NavController) {
  }
login() {
    this.navCtrl.push(LoginPage);

  }

但是当我移动到时，LoginPage我看不到后退按钮图标。我仍然看到那个小黑框图标。这里是那个图像：

在此处输入图像描述

请帮帮我。我错过了什么。

谢谢

4

1 回答 1

2

方块可能表示字体未正确加载或浏览器正在尝试使用备用字体。验证是否已加载 ionicons 字体的一种简单方法是在 Chrome 开发工具中检查您的源代码。我的看起来像这样：http://localhost:8100/assets/fonts/ionicons.woff2?v=3.0.0-alpha.3

如果您没有看到该文件（或类似文件）被加载，则没有要渲染的字体。

如果您的 package.json 文件中引用了 ionicon 字体并且它存在于 node_modules 文件夹中，则它应该会自动加载。验证这一点后，如果字体未加载，请确保您没有任何其他 CSS 导入/变量覆盖 ionicons 字体导入。例如这样的：

 * {font-family: 'Lato' !important;}

以上将导致永远不会加载 ionicons 字体，因为 Lato 被指定用于所有字形，覆盖早期的 @ionicons 导入。

于 2017-05-16T05:19:36.273 回答