Как создать кнопки на Bootstrap и какие варианты они предоставляют?

Пользователь

от lilla.herman , в категории: HTML/CSS , год назад

Как создать кнопки на Bootstrap и какие варианты они предоставляют?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от quinton.prosacco , год назад

@lilla.herman 

Для создания кнопок на Bootstrap следует использовать классы .btn и .btn- * (где * - это стиль кнопки).


Примеры стилей кнопок в Bootstrap:

  • .btn-primary - основной цвет кнопки
  • .btn-secondary - дополнительный цвет кнопки
  • .btn-success - зеленый цвет кнопки для выражения успеха
  • .btn-danger - красный цвет кнопки для выражения опасности
  • .btn-warning - желтый цвет кнопки для выражения предупреждения
  • .btn-info - синий цвет кнопки для информации
  • .btn-light - светлая кнопка
  • .btn-dark - темная кнопка


Кнопки могут быть в различных размерах:

  • .btn-lg - крупные кнопки
  • .btn-sm - мелкие кнопки
  • .btn-block - кнопки на всю ширину родительского элемента


Также, кнопки могут быть с различным стилем оформления:

  • .btn-outline-* - стиль кнопки с прозрачной заливкой и обводкой
  • .btn-rounded - кнопки с закругленными углами


Пример создания кнопки в Bootstrap:

1
Primary