Кнопки чекбоксы с иконками / Кнопки / Сниппеты Bootstrap | BootstrapТема

1
2
3
4
5

Версия: v1.0.1

Каталог: Сниппеты Bootstrap

Категория: Кнопки

Bootstrap: 3, 4

Для CMS: HTML, Drupal, Joomla, uCoz, WordPress, Magento, OpenCart, PrestaShop

Язык: Английский

Уникальный ID: 108

Количество символов:

Посмотрели: 2425 раз

Помощь: установка & настройка

Прокомментировали: 0 раз

Рейтинг: 5.0 / 5 - 4 голосов

Тип лицензии: CC BY 4.0

Авторство: http://u.to/kd0hDQ

Информация: Пользователям

Информация: Правообладателям

Теги: Snippet, CheckBox, Bootstrap, чекбокс, бутстрап

Поделился: BootstrapТема

Добавлено: 2015-11-29 в 20:59

Метка: 1582173472

⇄ ⇅

<link rel="stylesheet" href="https://bootstraptema.ru/plugins/2015/b-v3-3-6/bootstrap.min.css" />
<link rel="stylesheet" href="https://bootstraptema.ru/plugins/font-awesome/4-4-0/font-awesome.min.css" />
<script type="text/javascript" src="https://bootstraptema.ru/plugins/jquery/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="https://bootstraptema.ru/plugins/2015/b-v3-3-6/bootstrap.min.js"></script>

<style>
body{background:rgb(58,36,83)}
</style>
<style>
 .btn span.fa-check {
 opacity: 0.2;
 }

.btn.active span.fa-check {
 opacity: 1;
 }
</style>

<div class="container">

<div class="row">

<div class="col-lg-6 col-lg-offset-3 well well-sm text-center">

<div class="btn-group" data-toggle="buttons">

<label class="btn btn-success active">
 <input type="checkbox" autocomplete="off" checked="checked" />
 <span class="fa fa-check"></span>
 <span class="fa fa-money"></span>
 </label>
 <label class="btn btn-primary">
 <input type="checkbox" autocomplete="off" checked="checked" />
 <span class="fa fa-check"></span>
 <span class="fa fa-eur"></span>
 </label>
 <label class="btn btn-primary">
 <input type="checkbox" autocomplete="off" checked="checked" />
 <span class="fa fa-check"></span>
 <span class="fa fa-usd"></span>
 </label>
 <label class="btn btn-primary">
 <input type="checkbox" autocomplete="off" checked="checked" />
 <span class="fa fa-check"></span>
 <span class="fa fa-gbp"></span>
 </label>
 <label class="btn btn-primary">
 <input type="checkbox" autocomplete="off" checked="checked" />
 <span class="fa fa-check"></span>
 <span class="fa fa-yen"></span>
 </label>

</div>

</div>

</div>

</div>