Я использую CF7 (контактная форма 7) для создания формы для веб-сайта. Я использую переключатель для выбора типа услуги. Вот код CF7.
<div class="radio-group">
[radio cleaning-type class:cleaning-type default:1 "Standard" "Deep" "Move
In/Out"]</div>
Вот упрощенный HTML для кода
<div class="radio-group">
<div class="form-group wpcf7-form-control wpcf7-radio cleaning-type">
<div class="radio">
<label>
<input name="cleaning-type" type="radio" value="Standard" checked="" aria-invalid="false" aria-required="true" required="">Standard
</label>
</div>
<div class="radio">
<label>
<input name="cleaning-type" type="radio" value="Deep" aria-invalid="false" aria-required="true" required="">Deep
</label>
</div>
<div class="radio">
<label>
<input name="cleaning-type" type="radio" value="Move In/Out" aria-invalid="false" aria-required="true" required="">Move In/Out
</label>
</div>
</div>
</div>
CSS, связанный с приведенным выше кодом ниже
input[type=radio] {
position: absolute;
visibility: hidden;
display: none;
}
label {
color: #3f4b5e;
cursor: pointer;
font-weight: bold;
padding: 5px 20px;
}
.radio-group {
/*border: solid 3px #332f35;*/
display: inline-block;
margin: 20px;
border-radius: 10px;
overflow: hidden;
}
.radio {
display: inline-block;
border: solid 3px #332f35;
margin : 20px;
border-radius : 10px;
padding : 20px;
color: #3f4b5e;
}
.radio label input[type=radio]:checked{
color : #10b1e7;
background-color: gold;
}
Я ожидаю, что выбранный переключатель должен изменить цвет. Однако это не обнаружено.