带溢出的离子表

时间:2019-12-03 12:48:06

标签: html ionic-framework tabs

是否可以为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>

如果我滚动到右侧,则系统选项卡将正确显示。但是,如果我向左滚动,则“注册表”选项卡将无法正确显示。

1 个答案:

答案 0 :(得分:0)

CSS

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