diff options
Diffstat (limited to 'vendor/twbs/bootstrap/site/content/docs/5.3/components/buttons.md')
| -rw-r--r-- | vendor/twbs/bootstrap/site/content/docs/5.3/components/buttons.md | 18 |
1 files changed, 16 insertions, 2 deletions
diff --git a/vendor/twbs/bootstrap/site/content/docs/5.3/components/buttons.md b/vendor/twbs/bootstrap/site/content/docs/5.3/components/buttons.md index 396beec7f..ae58fca9a 100644 --- a/vendor/twbs/bootstrap/site/content/docs/5.3/components/buttons.md +++ b/vendor/twbs/bootstrap/site/content/docs/5.3/components/buttons.md @@ -6,9 +6,23 @@ group: components toc: true --- -## Examples +## Base class -Bootstrap includes several predefined button styles, each serving its own semantic purpose, with a few extras thrown in for more control. +Bootstrap has a base `.btn` class that sets up basic styles such as padding and content alignment. By default, `.btn` controls have a transparent border and background color, and lack any explicit focus and hover styles. + +{{< example >}} +<button type="button" class="btn">Base class</button> +{{< /example >}} + +The `.btn` class is intended to be used in conjunction with our button variants, or to serve as a basis for your own custom styles. + +{{< callout warning >}} +If you are using the `.btn` class on its own, remember to at least define some explicit `:focus` and/or `:focus-visible` styles. +{{< /callout >}} + +## Variants + +Bootstrap includes several button variants, each serving its own semantic purpose, with a few extras thrown in for more control. {{< example >}} {{< buttons.inline >}} |