Bootstrap 4 JS Button
Кнопка классы CSS
Для учебника о кнопках, прочитайте наши загрузочные кнопки учебник.
Классы, приведенные ниже, можно использовать для оформления любого элемента <a>, <Button> или <input>:
Класс | Описание | |
---|---|---|
.btn |
Добавление базовой стилизации к любой кнопке | |
.btn-block |
Делает кнопку уровня блока (охватывает всю ширину родительского элемента) | |
.btn-danger |
Указывает на опасное или потенциально отрицательное действие | |
.btn-dark |
Темная серая кнопка | |
.btn-default |
Указывает кнопку по умолчанию/Стандартная | |
.btn-info |
Контекстная кнопка для информационных предупреждающих сообщений | |
.btn-lg |
Делает большую кнопку | |
.btn-light |
Светлая серая кнопка | |
.btn-link |
Делает кнопку выглядеть как ссылка (все равно будет иметь поведение кнопки) | |
.btn-outline-* |
Создание контурной/обрамленной кнопки. Используйте любой из контекстуальных классов как * (BTN-контур-основной, BTN-план-успех, и т.д.) | |
.btn-primary |
Обеспечивает дополнительный визуальный вес и определяет основное действие в наборе кнопок | |
.btn-sm |
Делает маленькую кнопку | |
.btn-success |
Указывает на успешное или положительное действие | |
.btn-secondary |
Указывает на "менее" важное действие | |
.btn-toolbar |
Объединение наборов кнопок в панели инструментов кнопок для более сложных компонентов | |
.btn-warning |
Указывает на осторожность следует принимать с этим действием | |
.active |
Делает нажатой кнопку | |
.disabled |
Делает кнопку отключенной |
Через JavaScript
Включить вручную с помощью:
$('.btn').button();
Button Options
None |
Методы кнопок
В следующей таблице перечислены все доступные методы кнопок.
Примечание: Методы также могут передаваться через атрибуты данных; Добавьте имя метода в Data-, как при переключении данных или в методе Data-Dispose.
Метод | Описание | |
---|---|---|
.button("toggle") | Makes the button look pressed | |
.button("dispose") | Destroys an element's button |