-
Bootstrap курс
Bootstrap CSS
- Bootstrap CSS обзор
- Bootstrap Grid System
- Bootstrap наборный
- Bootstrap код
- Bootstrap таблица
- Bootstrap форма
- Bootstrap кнопка
- Bootstrap изображение
- Bootstrap Вспомогательный класс
- Bootstrap Отзывчивый Утилиты
Bootstrap Компоненты макета
- Bootstrap значок шрифты
- Bootstrap Выпадающее меню
- Bootstrap Группа кнопок
- Bootstrap Кнопка в раскрывающемся меню
- Bootstrap группа Поле ввода
- Bootstrap элементы навигации
- Bootstrap Панель навигации
- Bootstrap панировочные сухари
- Bootstrap пейджинг
- Bootstrap этикетка
- Bootstrap знак
- Bootstrap Большой экран
- Bootstrap Название страницы
- Bootstrap Миниатюры
- Bootstrap предупреждение
- Bootstrap Шкала прогресса
- Bootstrap Мультимедийные
- Bootstrap Список групп
- Bootstrap панель
- Bootstrap Wells
Bootstrap Виджет
- Bootstrap Plug-Glance
- Bootstrap эффект перехода
- Bootstrap режимное окно
- Bootstrap Выпадающее меню
- Bootstrap Свиток монитор
- Bootstrap таб
- Bootstrap подсказки
- Bootstrap Всплывающее окно
- Bootstrap Предупреждение коробки
- Bootstrap кнопка
- Bootstrap сгиб
- Bootstrap карусель
- Bootstrap Дополнительная навигация
Bootstrap другое
Лучшее руководство по Bootstrap группа кнопок в 2024 году. В этом руководстве вы можете изучить Основные группы кнопок,примеров,Кнопка на панели инструментов,примеров,Размер кнопки,примеров,гнездование,примеров,Вертикальная кнопка группы,примеров,
Bootstrap группа кнопок
Группа кнопок позволяет использовать несколько кнопок, чтобы быть уложены на одной линии. Если вы хотите, чтобы выровнять кнопки вместе, что очень полезно. Вы можете (кнопка) плагин Bootstrap , чтобы добавить дополнительный флажок и стиль поведения окно JavaScript.
В следующей таблице приведены некоторые из наиболее важных класса Bootstrap с помощью кнопок, предоставляемые группой:
| Class | 描述 | 代码示例 |
|---|---|---|
| .btn-group | 该 class 用于形成基本的按钮组。在.btn-group中放置一系列带有 class.btn的按钮。 |
<div class="btn-group"> <button type="button" class="btn btn-default">Button1</button> <button type="button" class="btn btn-default">Button2</button> </div> |
| .btn-toolbar | 该 class 有助于把几组 <div class="btn-group"> 结合到一个 <div class="btn-toolbar"> 中，一般获得更复杂的组件。 |
<div class="btn-toolbar" role="toolbar"> <div class="btn-group">ru.</div> <div class="btn-group">ru.</div> </div> |
| .btn-group-lg, .btn-group-sm, .btn-group-xs | 这些 class 可应用到整个按钮组的大小调整，而不需要对每个按钮进行大小调整。 |
<div class="btn-group btn-group-lg">ru.</div> <div class="btn-group btn-group-sm">ru.</div> <div class="btn-group btn-group-xs">ru.</div> |
| .btn-group-vertical | 该 class 让一组按钮垂直堆叠显示，而不是水平堆叠显示。 | <div class="btn-group-vertical"> ru. </div> |
Основные группы кнопок
Следующий пример демонстрирует приведенную выше таблицу , чтобы обсудить использованиекласса .btn-группы:
примеров
Попробуйте »
Результаты следующие:
Кнопка на панели инструментов
Следующий пример демонстрирует , приведенную выше таблицу , обсуждаются вклассе .btn-панели для использования:
примеров
Попробуйте »
Результаты следующие:
Размер кнопки
Следующий пример демонстрирует сказанное выше таблицы длякласса .btn-* Использование - группового:
примеров
Попробуйте »
Результаты следующие:
гнездование
Вы можете вкладывать другой Кнопка группы внутри группы, то есть в пределах.btn-группы гнездо другой .btn-группа.При использовании комбинации ряда кнопок и выпадающих меню, чтобы сделать, это будет использоваться.
примеров
Попробуйте »
Результаты следующие:
Вертикальная кнопка группы
Следующий пример демонстрирует сказанное выше таблицы длякласса .btn-группы вертикального использования:
примеров
Попробуйте »
Результаты следующие:
