从 ionic 3 中的 ion-item 中删除黑色基线边框条答案

【问题标题】：Remove black baseline border bar from ion-item in ionic 3从 ionic 3 中的 ion-item 中删除黑色基线边框条
【发布时间】：2019-12-05 06:46:06
【问题描述】：

如何从我的离子物品中移除这些黑条？类似问题的所有答案都不起作用

我的代码，在所有地方都应用了 no-lines 仍然没有运气

<ion-list no-lines>
    <ion-row padding-left margin-left no-lines>
      <ion-item no-lines padding align-self-center align-self-start>
        <ion-label floating color="light">{{ "EMAIL" | translate }}</ion-label>
        <ion-input clearInput type="email" [(ngModel)]="account.email"></ion-input>
      </ion-item>
    </ion-row>
  </ion-list>

【问题讨论】：

为什么要标记所有离子版本？你想在哪个领域做到这一点？
我需要离子 3
simple

标签： ionic-framework ionic2 ionic3

【解决方案1】：

在 Ionic 4 中，您必须在 item documentation 上使用 lines="none"

<ion-list>
  <ion-row padding-left margin-left>
    <ion-item lines="none" padding align-self-center align-self-start>
      <ion-label floating color="light">{{ "EMAIL" | translate }}</ion-label>
      <ion-input clearInput type="email" [(ngModel)]="account.email"></ion-input>
    </ion-item>
  </ion-row>
</ion-list>

还有其他选项，例如lines="inset" 和lines="full"，如果将其应用于ion-list 标记或ion-item 本身，它也会对列表元素的样式产生不同的影响。

【讨论】：

【解决方案2】：

在该页面的 scss 文件中添加：

.list-md .item-input:last-child{
   border-bottom : none
}

【讨论】：