ion-item 右下邊框

Question

我有一個離子項目描述為：

  <ion-row>
  <ion-item class = "Checkbox">
<ion-label>Remember my choice</ion-label>
<ion-checkbox [(ngModel)]="remember"></ion-checkbox>
  </ion-item>
  </ion-row>

其中 Checkbox 類被描述為：

.Checkbox {
   color: white;
   background:#c34545;
}

問題是這給了我的 ion-item 一個奇怪的右下邊框，你可以查看：

我發現按鈕類的邊框屬性為：

button {
border: 0;
border-top-color: initial;
border-top-style: initial;
border-top-width: 0px;
border-right-color: initial;
border-right-style: initial;
border-right-width: 0px;
border-bottom-color: initial;
border-bottom-style: initial;
border-bottom-width: 0px;
border-left-color: initial;
border-left-style: initial;
border-left-width: 0px;
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;

但是禁用它給了我這個：

這真的讓我把頭發拉出來。 scss 文件中唯一可能發生的沖突是我定義的 ion-row：

ion-row {
   align-items: center;
   text-align: center;
}

Answer 1

刪除底線的最佳方法是向ion-item添加no-lines屬性。 無需添加任何css樣式。

Answer 2

向 ion-item 標簽傳遞一個名為 lines 且值為 none 的參數。

<ion-item lines="none">

Answer 3

找到了答案，感謝 Bellians 先生的評論。 我去又看了一眼。

.item-md.item-block .item-inner {
padding-right: 8px;
border-bottom: 1px solid #dedede;
  }

正如你所看到的，它有一個邊框底部。 我在我的 scss 文件中覆蓋了它，現在看起來很好。