Набор переключателей CSS с разным дизайном

Нужны переключатели CSS на сайт без использования скриптов? Предлагаем скачать целую библиотеку наработок с использование обычных checkbox`ов.

Почему хочется стилизовать переключатели CSS

Допустим, у Вас на сайте есть поля пользователей, которые подразумевают под собой выбор значений с помощью элементов формы checkbox или radiobox. Стандартное оформление этих элементов пользовательского интерфейсов оставляет желать лучшего и просит передать привет 00-ым года. Конечно, некоторые браузеры стали обращать внимания на унылые переключатели и принялись из версии в версию их модернизировать.

Но классика есть классика и каких-то кардинальных изменений в дизайне переключателей ждать не стоит. Как правило, к стилизации чекбоксов и радиобоксом прибегают с помощью JavaScript. Но так ли это необходимо? Подключение лишних библиотек это всегда дополнительная нагрузка на сайт. Поэтому, оптимальным вариантов будет использование переключателей CSS.

Подключение и использование библиотеки для стилизации чекбоксов и радиобоксов

1. Первое, что нужно сделать, это скачать саму библиотеку — checkboxes.min.css;

2. Привязываем ее к нашему сайту:

3. И выбираем понравившееся оформления из списка на странице демонстрации, нажав на кнопку HTML:

4. Вставляем HTML-код в необходимое место документа и наслаждаемся стилизованными переключателями!

Скачать файл стилей для переключателя CSS можно по ссылке выше.