如何在ionic 4中给Alert Controller CSS? [英] how to give Alert Controller css in ionic 4?

问题描述

我想在ionic 4中提供警报控制器样式，这是我的演示代码，

I want to give alert controller style in ionic 4.these is my demo code,

async presentalert() {
    const alert = await this.alertCtrl.create({
      header: '  DO YOU WANT TO CANCEL',
      message: 'DO YOU WANT TO CANCEL',
      cssClass: 'alertCancel',
      mode: 'ios',
      buttons: [
        {
          text: 'NO',
          role: 'cancel',
          cssClass: 'alertButton',
          handler: () => {
            console.log('Confirm Cancel');
          }
        }, {
          text: 'YES',
          cssClass: 'alertButton',
          handler: () => {
            console.log('Confirm Okay');
          }
        }
      ]
    })
    await alert.present();
  }

我试图在global.scss中应用scss

and i tried to apply scss in global.scss

 .alertCancel{
    --background: red;
  }
  .alertButton {
     background-color: white !important;
  }

我已经尝试了所有可能的方法来在警报控制器中提供CSS，但是它不起作用，所以请帮助我，我被困在这里.

I have tried every possible way to give css in alert controller but it s not working so please help me I am stuck here.

推荐答案

--background是组件ion-alert的css变量，因此请在variables.scss

--background is a css variable of the component ion-alert, therefore do the following in the variables.scss

ion-alert
{
 --background: red !important;
}

供参考:

https://ionicframework.com/docs/theming/css-variables #ionic-variables

这篇关于如何在ionic 4中给Alert Controller CSS?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！