更改开关中所选标签的背景颜色

Question

有什么方法可以更改Oracle APEX 5.1.4中Switch所选药丸的背景颜色。

基本上，而不是默认开关像这样显示：

当选择“是”时，我希望开关显示如下：

并且当选择'否'时，显示如下：

有什么方法可以实现？

项目的HTML代码：

<fieldset tabindex="-1" id="SHOW_RECORDS" class="apex-button-group apex-item-yes-no apex-item-select">
    <legend class="u-VisuallyHidden">&lt;b&gt;Show Data&lt;/b&gt;</legend>
    <input type="radio" id="SHOW_RECORDS" name="SHOW_RECORDS" value="Y" required="" aria-required="true">
        <label for="SHOW_RECORDS_Y" class="a-Button">Yes</label><input type="radio" id="SHOW_RECORDS_N" name="SHOW_RECORDS" value="N" checked="checked">
        <label for="SHOW_RECORDS_N" class="a-Button">No</label>
</fieldset>

Answer 1

是按钮组还是收音机？我没有APEX 5.1，但是假设您可以为此任务编写两个CSS规则。像这样的东西：

.apex-item-option input[value='Y'][checked="checked"] + label {
    background-color: green;
}

.apex-item-option input[value='N'][checked="checked"] + label {
    background-color: red;
}

Answer 2

这项工作吗？

input[type="radio"][value="Y"][checked="checked"] + label.a-Button {
        background-color: red;
        color: #fff;
}
input[type="radio"][value="N"][checked="checked"] + label.a-Button {
        background-color: green;
        color: #fff;
}

Answer 3

[经过大量的反复试验，找到了解决方法。

我在主题栏中创建了自定义CSS。

/* Custom On/Off Color - No Color */
.t-Form-fieldContainer--radioButtonGroup .customOnOffColor.apex-item-radio input:checked + label,
.customOnOffColor.apex-button-group input:checked+label {
    background-color: #EF9A9A;
}

/* Custom On/Off Color - Yes Color */
.t-Form-fieldContainer--radioButtonGroup .customOnOffColor.apex-item-radio input[value=Y]:checked + label,
.customOnOffColor.apex-button-group input[value=Y]:checked+label {
    background-color:#A5D6A7
}

然后在Advanced-> CSS类中添加了customOnOffColor类。

[谢谢Ivan和Tony指导我正确的方向。