Ionic 4，如何降低ionic-segment-button的高度

Question

我有以下可滚动段的代码：

<ion-segment mode="md" scrollable >
  <ion-segment-button mode="md" *ngFor="let category of categories" value={{category}} (click)="FilterCateg(category)" >
    {{ category }}
  </ion-segment-button>
</ion-segment>

如何更改 ion-segment/ ion-segment-button 的 height。当前默认为 50px。我试过在 CSS 中设置 height 但没有效果。已找到 SASS variables $segment-button-md-height and $segment-button-md-line-height 但无法在 Ionic 4

中找到对应项

Answer 1

page.scss

ion-segment-button - 在 md mode default

中取 min-height 50px

你只在你的按钮中给了 height 然后只有 2px 高度减少因为 min-height 默认是 50px 所以，

并且您仅在按钮中使用 min-height 然后高度没有变化

所以同时使用 height 和 min-height

示例如下：

ion-segment-button{
    min-height: 30px; //Depends on you
    height: 30px; //Depends on you
}

Ionic 4，如何降低ionic-segment-button的高度

Ionic 4, how to reduce the height of ionic-segment-button

css

ionic-framework

ionic4