从放置在卡片内的离子项目移除边框答案

【问题标题】：Removing border from ion-item placed inside a card从放置在卡片内的离子项目移除边框
【发布时间】：2019-08-17 21:14:32
【问题描述】：

您好，我正在尝试创建一张卡片，其中包含一个项目。问题是我无法删除的项目下方有一个灰色边框。我尝试过使用 no-lines 和 css 样式，但到目前为止没有任何效果。

<ion-card>
    <ion-list>
        <ion-item no-lines>
            <p>Hello World!!</p>
        </ion-item>
    </ion-list>
</ion-card>

当我运行代码时，这就是我得到的。

我也尝试将 no-lines 放在 ion-list 中

离子版本：3.20.0

【问题讨论】：

标签： css ionic3

【解决方案1】：

使用 Ionic 4，这条线对我有用：

<ion-item lines="none">

如果想从列表中删除所有行，可以在 ion-list 标记中使用相同的标记。
希望这对某人有所帮助。 o/

【讨论】：

【解决方案2】：

您应该在<ion-list> 中添加no-lines，而不是<ion-item>。看看下面的例子。

 <ion-list no-lines *ngFor="let item of allItems">
      <ion-item >
        <span class="text-label">{{item.name}}</span>
        <span class="text-label" text-center>{{item.description}}</span>
      </ion-item>
  </ion-list>

【讨论】：

【解决方案3】：

Inic 4 用户；

<ion-item lines="none">
  <h1>Header</h1>
</ion-item>

有关 ionic 4 中的其他行选项，请参阅 documentation

【讨论】：