css - Ionic 3 如何将 ionic radio 颜色的 radio 图标更改为另一种颜色？

Question

我需要更改选中的单选图标的颜色。

我将 ion-radio 的现有样式更改为:

ion-radio.radio.radio-checked, ion-radio.radio.radio-md
{
   background-color: white;
}

但这不是必需的。

然后改为:

ion-radio.radio.radio-checked, ion-radio.radio.radio-md
{
   color: white;
}

还是一样。

我需要将选中变量的蓝色更改为白色。

然后我尝试将 radio-inner 和 radio-icon 更改为:

ion-radio.radio.radio-checked, ion-radio.radio.radio-md
, ion-radio.radio.radio-icon, ion-radio.radio-inner{
  background-color: white;
}

但它并没有改变。

根据文档，我们应该将以下 css 变量更改为另一种颜色:

--color-checked 

但还是一样。这是一个 stackblitz .

Answer 1

请试试这个CSS代码:

.radio-md .radio-checked,
.radio-md-primary .radio-checked {
  border-color: #fff;
}
.radio-md .radio-inner,
.radio-md-primary .radio-inner {
   background-color: #fff;
}
.item-md .radio-md {
   background-color: transparent;
}

并删除这段代码:

ion-radio.radio.radio-checked, ion-radio.radio.radio-md
{
   background-color: white;
}