0

Ребят, подскажите как стилизовать checkbox без использования дополнительных библиотек ? Чтобы сделать чекбокс такой как в макете?

3
  • В каком маркете? Commented 17 нояб. 2015 в 14:16
  • Дали тестовый макет который нужно сверстать, но я не знаю как поставить чекбокс который изображен в макете, вопрос заключается в том, как мне это сделать ?
    – SvArt713
    Commented 17 нояб. 2015 в 14:44
  • В целом можно поступить так: верстаете свой контрол, поверх кнопки кладете label с указанием на нативный контрол чекбокса, делаем его opacity = 0, а размеры подгоняем по элементу нашего нового чекбокса. Commented 17 нояб. 2015 в 16:42

1 ответ 1

3

input[type="checkbox"]{
    position:absolute;
    visibility:hidden;
    z-index:-1;
}
input[type="checkbox"]:checked + label{
    color:red;
}
<input type="checkbox" id="box1" />
<label for="box1">checkbox #1</label>

Демо: http://jsfiddle.net/kb67J/1/.

Вместо color и текста вставьте в label картинки фоном.

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.