Hur skapar man knappar i Bootstrap 5?

För att skapa knappar i Bootstrap 5 kan du använda elementet `` tillsammans med lämpliga Bootstrap-knappklasser. Så här kan du skapa olika typer av knappar med Bootstrap 5:

Standardknapp:

```html

Standard

```

Detta skapar en blå standardknapp.

Anpassade färgknappar:

För att skapa knappar med olika färger kan du använda klasserna `btn-{color}`, där `{color}` kan ersättas med något av följande:

- primär

- sekundär

- framgång

- fara

- varning

- info

- ljus

- mörkt

Till exempel, för att skapa en röd knapp:

```html

Fara

```

Konturknappar:

För att skapa konturknappar, använd klasserna `btn-outline-{color}`. Till exempel, för att skapa en konturerad röd knapp:

```html

Fara

```

Inaktiverade knappar:

För att inaktivera en knapp, lägg till "disabled"-attributet till den.

```html

Inaktiverad

```

Knappstorlekar:

Du kan också ändra storleken på knappar genom att använda klasserna `btn-{size}`, där `{size}` kan vara något av följande:

- sm (liten)

- lg (stor)

Till exempel, för att skapa en liten knapp:

```html

Liten

```

Anpassad stil:

Du kan ytterligare anpassa utseendet på knappar genom att lägga till anpassade CSS-stilar till dem.

Här är en tabell som sammanfattar Bootstrap 5-knappklasserna och deras effekter:

| Klass | Effekt |

|---|---|

| `btn` | Skapar en grundläggande knapp. |

| `btn-primär` | Skapar en blå knapp. |

| `btn-sekundär` | Skapar en grå knapp. |

| `btn-framgång` | Skapar en grön knapp. |

| `btn-fara` | Skapar en röd knapp. |

| `btn-varning` | Skapar en gul knapp. |

| `btn-info` | Skapar en ljusblå knapp. |

| `btn-light` | Skapar en vit knapp. |

| `btn-mörk` | Skapar en svart knapp. |

| `btn-outline-{color}` | Skapar en konturknapp i den angivna färgen. |

| `btn-{storlek}` | Ändrar storleken på knappen. |

Du kan kombinera flera klasser för att skapa mer komplexa knappstilar. Till exempel skapar följande kod en liten röd knapp med kontur:

```html

Liten

```