如何删除离子中的项目内边界

Question

      <ion-item  color="transparent" padding="0px">
        <ion-input type="email" placeholder="username"></ion-input>

      </ion-item>

      <ion-item color="transparent" padding="0px" no-lines>
        <ion-input  id="password" type="password"  placeholder="Password"></ion-input>
        <ion-icon name="albums"></ion-icon>
      </ion-item>

我在离子中创建一个登录表单。但我有一个问题，我想在item-inner中使用底部白色边框。我的CSS无法正常工作，如果你有什么建议给我的话，请给我.....谢谢

Answer 1

试试吧：

<ion-list lines="none">
      <ion-item  color="transparent" padding="0px">
        <ion-input type="email" placeholder="username"></ion-input>

      </ion-item>

      <ion-item color="transparent" padding="0px" no-lines>
        <ion-input  id="password" type="password"  placeholder="Password"></ion-input>
        <ion-icon name="albums"></ion-icon>
      </ion-item>
</ion-list>

要么

.item-inner{
  border-style: unset !important;
}

Answer 2

试试这个

<ion-item lines="none" class="remove_inner_bottom"> //here is the border bottom removal code
    <ion-label>
      No Lines Item
    </ion-label>
  </ion-item>

上面的代码没有边框底部

在你的CSS里面

.remove_inner_bottom{
   --inner-border-width: 0; // this removes the inner border width
}

请找到link用于应用离子项目的sass