Поясните пожалуйста, как работает эта конструкция:
#btn-1:checked ~ .slider-controls label[for="btn-1"] {
background:#666;
}
Я понимаю, что она влияет на цвет подписи при переключении радио-кнопки. Но по факту мы ведь радио-кнопки сами скрыли, каким образом переключение идет по подписям этих кнопок?
Да, чекбоксы скрыты, но это не влияет на их выделение. Такая запись читается как «подпись к чекбоксу label[for=“btn-1”], находящаяся в блоке .slider-controls, следующий за выделенным чекбоксом #btn-1».
Получается, что за счет привязки подписи к чекбоксу при выделении подписи выделяется связанный с ней чекбокс?
Да, именно так.