当我尝试更改这些组件上的 ionic 按钮样式时,即使使用 !important 或使用新的自定义类,它也不会更改任何内容。这是代码:
<ion-content padding>
<ion-list>
<button ion-button block class=" custbtnnew" (click)=" SelectImage()">
Select
</button>
<br>
<button style="margin-top:20px;" ion-button block class="custbtnnew" (click)="UploadImage()">
Upload
</button>
</ion-list>
<div *ngIf="images" class="group">
<ion-grid>
<ion-row>
<ion-col col-6 col-md-4 col-lg-3 col-xl-2 class="created_group" *ngFor="let image of images">
<div class="container">
<div class="imgs">
<img class="imgBg"
src="URL">
<button *ngIf="images" ion-button clear (click)="SetProfileImage(image)" class="imgBtn">
Set As Default
</button>
<button *ngIf="images" ion-button clear (click)="Delete(image)" class="imgBtn">
Delete Image
</button>
</div>
</div>
</ion-col>
</ion-row>
</ion-grid>
</div>
</ion-content>
CSS
.custbtnnew {
border-radius: 40px !important;
background: -webkit-gradient(linear, left top, right top, from(#DD2476), to(#FF512F));
background: linear-gradient(to right, #DD2476, #FF512F);
}
什么会导致这样的问题,如何改变它?
最佳答案
您可能需要围绕您的 .scss 进行页面声明
page-home {
.custbtnnew {
border-radius: 40px !important;
background: -webkit-gradient(linear, left top, right top, from(#DD2476), to(#FF512F));
background: linear-gradient(to right, #DD2476, #FF512F);
}
}
关于css - ionic 3 元素中的按钮样式无法更改,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56375512/