调整 ionic-item 的高度

在 ion-card中,有时候ion-item的高度对于手机来说有点高,有两个地方可以调整,可以同时更改两个参数,也可以更改其中一个.

1.给 ion-item添加一个class 并设置它的min-height高度.

html文件

<ion-item class='item-small' detail-push>
          <span class='item-text'>  提问
          </span>
          <ion-badge item-end color='danger'>
            3
          </ion-badge>
        </ion-item>
        <ion-item detail-push class='item-small'>
          错题
          <ion-badge item-end color='danger'>
            3
          </ion-badge>
        </ion-item>
        

scss文件

.item-small {
    min-height:1rem;
    border-bottom: 0.55px solid #c8c7cc; <<-添加一个和 ionic 下划线一致的下划线
  }

min-height.gif

2.在theme/varliables.scss文件中全局调整.

$item-ios-padding-bottom:2px;
$item-ios-padding-top:2px;