[英]Remove foucs line of ion-list items in ionic
<ion-list >
<ion-item style="margin-bottom: 10px; border: 1px solid #A7A7A7" no-lines>
<ion-label>
<ion-icon ios="ios-mail" md="md-mail"></ion-icon>
</ion-label>
<ion-input no-lines [(ngModel)]="loginData.email" [formControl]="email" id="email" type="text" required placeholder="Email *"></ion-input>
</ion-item>
<ion-item style="border: 1px solid #A7A7A7">
<ion-label>
<ion-icon ios="ios-unlock" md="md-unlock"></ion-icon>
</ion-label>
<ion-input no-lines [(ngModel)]="loginData.password" [formControl]="password" id="password" type="{{passwordtype}}" required
placeholder="Password *"></ion-input>
<button class="eye-icon-btn" type="button" item-right (click)="managePassword()">
<ion-icon name="{{passeye}}"></ion-icon>
</button>
</ion-item>
</ion-list>
我需要删除上述屏幕截图中突出显示的红色圆圈边界。 怎么做?
尝试这个
为ion-item
添加no-lines
<ion-item no-lines></ion-item>
并使用 css box-shadow
属性移除焦点box-shadow
item-inner { border-bottom-color: transparent !important; box-shadow: none !important; }
我今天在使用 Ionic 5 时遇到了同样的问题。对我有用的是将 lines="none" 添加到 ion-item:
<ion-item lines="none"> <ion-input class="verification-code-input ion-text-center" type="text"></ion-input> </ion-item>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.