#html #css
Вопрос:
Вот мои маленькие попытки в этом, попробовал использовать проверенный и целевой, но ничего не вышло
.label-test {
font-size: 13;
color: #6b7072;
}
.label-test:active {
color: #fff;
text-transform: capitalize;
}
<input type="checkbox" class="input-test" id="work">
<label for="work" class="label-test">all works</label>
Ответ №1:
Я не совсем понимаю цель, но если она заключается в том, чтобы применить text-transform: capitalize
флажок, когда установлен флажок, то следующий CSS сделает это:
input.input-test:checked label.label-test {
text-transform: capitalize;
}
Это работает за счет изменения стиля label
после input
того, как когда input
есть checked
.
Вот рабочий фрагмент, показывающий это в действии:
.label-test {
font-size: 13;
color: #6b7072;
}
.label-test:active {
color: #fff;
text-transform: capitalize;
}
input.input-test:checked label.label-test {
text-transform: capitalize;
}
<input type="checkbox" class="input-test" id="work">
<label for="work" class="label-test">all works</label>