如何将离子标签图标对齐？

Question

我有一个离子2应用程序，我使用了几个标签，如下所示：

<ion-tabs color="dark" [selectedIndex]="index" class="right-align">  
  <ion-tab [root]="homePage" tabTitle="Home" tabIcon="home" ></ion-tab>
  <ion-tab [root]="aboutPage" tabBadge="{{itemCount}}" tabTitle="About" tabIcon="ios-cart" tabBadgeStyle="danger"></ion-tab>
</ion-tabs>

默认情况下，这两个标签图标位于页面的中心位置，是否可以将这些标签图标对齐到右侧并缩小两个图标之间的间距？

Answer 1

ion-tabs标记有一个属性可以更改图标位置：

<ion-tabs tabslayout="icon-end"> ... </ion-tabs>

icon-end值会将图标向右推。

关于差距你需要更清楚这是什么差距。在标签按钮之间，两个按钮只有4px的填充分割，这不是一个很大的差距，但你可以在图标上添加更多的填充，这样它就可以向右推。

希望这有帮助。