Как изменить цвет кнопок в bootstrap?

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

от elda , в категории: HTML/CSS , 6 месяцев назад

Как изменить цвет кнопок в bootstrap?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

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

от ian.heidenreich , 6 месяцев назад

@elda 

Для изменения цвета кнопок в Bootstrap, вы можете использовать классы CSS, предоставляемые фреймворком. В Bootstrap есть несколько встроенных классов для разных цветов кнопок:

  1. btn-primary - голубой
  2. btn-secondary - серый
  3. btn-success - зеленый
  4. btn-danger - красный
  5. btn-warning - оранжевый
  6. btn-info - синий
  7. btn-light - светло-серый
  8. btn-dark - темно-серый


Чтобы изменить цвет кнопки, просто добавьте соответствующий класс к тегу кнопки. Например:

1
2
<button class="btn btn-primary">Primary Button</button>
<button class="btn btn-success">Success Button</button>


Вы также можете создать свой собственный класс CSS и применить его к кнопке для определенного цвета. Например, если вы хотите создать кнопку с красным цветом, вы можете создать следующий класс CSS:

1
2
3
4
.btn-red {
  background-color: red;
  color: white;
}


Затем примените этот класс к тегу кнопки:

1
<button class="btn btn-red">Red Button</button>


Это позволит вам создавать собственные цвета кнопок в Bootstrap.