In Bootstrap 5, buttons are an essential component used for interactive elements and user interactions. Bootstrap provides a variety of classes to style buttons and enhance their functionality. Here's an example of how to use buttons in Bootstrap 5:
html
<button type="button" class="btn btn-primary">Primary Button</button>
<button type="button" class="btn btn-secondary">Secondary Button</button>
<button type="button" class="btn btn-success">Success Button</button>
<button type="button" class="btn btn-danger">Danger Button</button>
<button type="button" class="btn btn-warning">Warning Button</button>
<button type="button" class="btn btn-info">Info Button</button>
<button type="button" class="btn btn-light">Light Button</button>
<button type="button" class="btn btn-dark">Dark Button</button>
In the above example, each button is created using the `<button>` element and a combination of classes to define the button style. The `btn` class is the base class for buttons, and you can use additional classes like `btn-primary`, `btn-secondary`, `btn-success`, `btn-danger`, `btn-warning`, `btn-info`, `btn-light`, or `btn-dark` to set the desired button color.
You can also customize the button size by using the `btn-lg` class for large buttons, `btn-sm` for small buttons, or `btn-block` to make the button full-width.
html
<button type="button" class="btn btn-primary btn-lg">Large Button</button>
<button type="button" class="btn btn-secondary btn-sm">Small Button</button>
<button type="button" class="btn btn-success btn-block">Block Button</button>
To create outline buttons, add the `btn-outline-*` class along with the color class. For example:
html
<button type="button" class="btn btn-outline-primary">Primary Outline Button</button>
<button type="button" class="btn btn-outline-secondary">Secondary Outline
Button</button>
In addition to the basic buttons, Bootstrap offers various button styles, such as rounded buttons, button groups, dropdown buttons, and more. You can explore these options in the official Bootstrap documentation for buttons: [Bootstrap Buttons](https://getbootstrap.com/docs/5.0/components/buttons/)
Remember to include the Bootstrap CSS and JavaScript files in your HTML document to ensure that the buttons and other Bootstrap components work properly.
Silan Software is one of the India's leading provider of offline & online training for Java, Python, AI (Machine Learning, Deep Learning), Data Science, Software Development & many more emerging Technologies.
We provide Academic Training || Industrial Training || Corporate Training || Internship || Java || Python || AI using Python || Data Science etc