移除离子项目分隔符 [英] Remove ion item divider

问题描述

如何删除 <ion-item> 分隔符?我有以下代码可以连续显示 4 个项目:

How I can remove <ion-item> divider? I have the following code to show 4 items in a row:

<ion-row ion-list>
    <ion-col width-25 *ngFor="let player of players">
              <ion-item color="dark">
                  <ion-avatar item-left>
                      <img [src]="photo" class="img img-circle"/>
                  </ion-avatar>
                  {{user.name}}
              </ion-item>
              </ion-col>
            </ion-row>

输出连续显示 4 张图像，但每个图像下方都有一个白色分隔线.我不想要任何分隔符.

and the output shows 4 images in a row, as excepted, but each image has a white divider below it. I don't want any divider.

我尝试设置 style="border:none" 但没有成功.

I tried to set style="border:none" but it didn't do it.

推荐答案

这是针对ionic 2和3的.请参考this answer适用于更高版本的离子

This is for ionic 2 and 3. Please refer to this answer for higher versions of ionic

使用no-lines

<ion-row ion-list>
    <ion-col width-25 *ngFor="let player of players">
         <ion-item no-lines color="dark"><!-- here -->
              <ion-avatar item-left>
                  <img [src]="photo" class="img img-circle"/>
              </ion-avatar>
              {{user.name}}
         </ion-item>
     </ion-col>
</ion-row>

这篇关于移除离子项目分隔符的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！