@lodbrok

Работа псевдокласса :checked в связке с другими классами?

Добрый день. Разъясните насчет использования псевдокласса :checked с другими классами, я так понял что работать он будет с комбинаций ~ во втором случае.
1)
#btn-1:checked .slider-controls label {
    background-color: #666666;
}

2)
#btn-1:checked ~ .slider-controls label {
    background-color: #666666;
}
  • Вопрос задан
  • 71 просмотр
Решения вопроса 2
victory_vas
@victory_vas
мне кажется, тут суть не в :checked. Просто логично, что в чекбоксе у вас не может быть вложен другой селектор. А вот рядом стоять (~) может. Поэтому 1й вариант работать не может, а второй - да (сложно утверждать на 100%, не видя вашего HTML)
Ответ написан
Комментировать
@hesrun
Да, т.к. первый селектор подразумевает, что .slider-controls label находится в инпуте, а такого быть не может...

По этому рабочий второй вариант, они ищет братьев по дом дереву. Тут два варианта или "+" - если нужен следующий, или "~" - если нужные все следующие братья.

Ну или по чекеду применяться стили для самого инпута.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы