Att skapa en Bootstrap 5-knappsgrupp är enkelt och okomplicerat. Så här kan du göra det:
```html
```
Denna kod kommer att skapa en knappgrupp med tre knappar riktade horisontellt. Här är en uppdelning av koden:
1. `
`:Detta skapar knappgruppsbehållaren. Attributet `role="group"` indikerar att knapparna i den här behållaren är en del av en grupp, och attributet `aria-label` ger en beskrivning av knappgruppens syfte.
2. ` `:Detta skapar den första knappen i gruppen. Attributet `type="button"` specificerar att knappen inte skickar ett formulär, och `class="btn btn-primary"`-attributen utformar knappen som en primär knapp i Bootstraps standardtema.
3. På liknande sätt skapar de andra två `
`-elementen mellan- och högerknapparna med samma stil och funktionalitet.
Den resulterande knappgruppen kommer att se ut så här:
[Bild av en knappgrupp med tre primära knappar märkta "Vänster", "Middle" och "Höger"]
Du kan anpassa knappgruppen genom att lägga till ytterligare knappar, ändra knappstilen och ändra attributet `aria-label` för att ge en annan beskrivning.
Här är några ytterligare alternativ för att anpassa knappgrupper:
* För att justera knapparna vertikalt, lägg till klassen `btn-group-vertical` till `
`-behållaren.
* För att skapa en uppsättning alternativknappar, lägg till dataattributet `btn-group-toggle` till `
`-behållaren och ställ in `role="radiogroup"`-attributet på ``-elementet inom varje `
`.
* För att skapa en uppsättning kryssrutor, lägg till dataattributet `btn-group-toggle` till `
`-behållaren och ställ in `role="checkboxgroup"`-attributet på ``-elementet inom varje ``.
* För att inaktivera en knapp, lägg till attributet `disabled` till elementet `