Knappar

Primär knapp

Standardknapp

Icon

Kompakt knapp

Liten knapp

Inaktiv knapp

Gör knapparna inaktiva genom att lägga till disabled-attributet.

A-taggar stödjer inte disabled-attributet, så du måste lägga till .disabled-klassen för att få den visuellt att visas inaktiverad.

Inavtiv standard Inaktiv primär

Knappar utan text

Lägg till ett aria-label attribut när knappen saknar en text som beskriver vad som händer när man väljer knappen. Attributet ska beskriva vad som händer, t.ex. stäng, så att den som lyssnar sig igenom en tjänst med skärmläsare kan förstå syftet med knappen.

A/input-element

.c-btn-klasserna är utformade för att användas med button-elementet, men du kan också använda dessa klasser på a- eller input-element

Länk som en knapp