更改 Ionic Toast 中的超链接颜色

Question

我正在使用一项服务向用户展示 toast，并且我正在使用 innerHTML 通过 toast 中的超链接。吐司中的文字是白色的，背景是蓝色的。但是，我正在通过的锚标记中的超链接不可读，并且显示为比 toast 的背景略浅的蓝色。我只是希望它们与文本的其余部分颜色相同（白色）。

import { ToastController } from '@ionic/angular';

async presentToast(message, color, duration, position) {
    const toast = await this.toastController.create({
      message: message,
      duration: duration,
      color: color,
      position: position
    });
    toast.present();
  }

然后我使用这样的服务：

 showToast(){
   this.toastService.presentToast('Please <a href = \'https://www.google.co.uk\'  target= \'_blank\'> click me</a>', 'primary', 4000, 'top', );
  }

以下是正在传递的原色：

--ion-color-primary: #0000A0;
--ion-color-primary-rgb: 66,140,255;
--ion-color-primary-contrast: #ffffff;
--ion-color-primary-contrast-rgb: 255,255,255;
--ion-color-primary-shade: #0000A0;
--ion-color-primary-tint: #0000A0;

有没有办法使用 css 类覆盖超链接颜色？或者我的原色中是否有一个值，我可以更改以获得所需的结果？

Answer 1

两者都可以。如果您不想覆盖全局配置，请为您的元素分配一个类，然后应用 css 样式

.toast-link a {
color: ...; // whatever color you'd like
}