CSS använder regler för att definiera hur element ska utformas. En CSS-regel består av tre delar:
- Selektor: Anger vilket element som regeln gäller för
- Egenskap: Anger vilken egenskap som ska ändras
- Värde: Anger vilket värde egenskapen ska ha
Praktiska steg:
- Välj ett element: Börja med att välja det element som du vill styla. Du kan använda HTML-taggar för att välja element, t.ex.
p
för stycken eller h1
för rubriker.
- Ange en egenskap: Välj den egenskap som du vill ändra, t.ex.
color
för att ändra textfärgen eller font-size
för att ändra textstorleken.
- Ange ett värde: Välj ett värde för egenskapen, t.ex.
red
för röd text eller 24px
för en textstorlek på 24 pixlar.
- Lägg till semikolon: Avsluta varje regel med ett semikolon (;).
- Placera inom klammerparenteser: Placera flera regler inom klammerparenteser ({ }).
Exempel:
p {
color: red;
font-size: 24px;
}
Denna regel anger att alla stycken (p
) ska ha röd text (color: red
) och en textstorlek på 24 pixlar (font-size: 24px
).
Tips för tillgänglighet:
- Använd kontrastfärger för att göra texten lätt att läsa.
- Använd tillräckligt stor textstorlek för att göra texten tydlig.
- Undvik blinkande eller föränderliga effekter som kan orsaka anfall.