溢出的离子标签

Question

是否可以为 ion-tab 标签提供样式属性以使其可滑动。

我试过了，效果不错，但看起来不太好。

其中一个选项卡显示不完整。

HTML

<ion-tabs>

<ion-tab-button tab="registrieren">
  <ion-icon name="person-add"></ion-icon>
  <ion-label>Registrieren</ion-label>
</ion-tab-button>

<ion-tab-button tab="aufnahme">
  <ion-icon name="add-circle"></ion-icon>
  <ion-label>Aufnahme</ion-label>
</ion-tab-button>

<ion-tab-button tab="entfernen">
  <ion-icon name="remove-circle"></ion-icon>
  <ion-label>Entfernen</ion-label>
</ion-tab-button>

<ion-tab-button tab="standortwechsel">
  <ion-icon name="md-car"></ion-icon>
  <ion-label>Übergabe</ion-label>
</ion-tab-button>

<ion-tab-button tab="admin-bestand">
  <ion-icon name="ios-albums"></ion-icon>
  <ion-label>Bestand</ion-label>
</ion-tab-button>

<ion-tab-button tab="system">
  <ion-icon name="settings"></ion-icon>
  <ion-label>System</ion-label>
</ion-tab-button>

如果我滚动到右侧，系统选项卡会正确显示。但是，如果我向左滚动，Registrieren 选项卡显示不正确。

Answer 1

CSS

ion-tab-bar {
   overflow-x: scroll;
   justify-content: left;
}

溢出的离子标签

Ion-Tabs with Overflow

html

tabs

ionic-framework