Hvad er Cascading Style Sheets (CSS)?

Et af de store mantraer i at have en hjemmeside er, at alle sider er sat ens op. En del af sitets "personlighed" er de farver, fonte osv. der anvendes. Det er derfor en fordel for brugerens oplevelse af sitet, at dette er konsistent. Ved at have ét sted hvor man definerer hvordan f.eks. tekstens font og størrelse skal være, sikrer man sig, at der ikke indsniger sig fejl, så siderne ser underlige ud. Omvendt kan man så også, hvis man finder ud af at f.eks. stylingen på ens overskrifter skal ændres, ved at ændre i style sheetet få ændringen ud på alle siderne uden at skulle åbne og ændre alle siderne på sitet.

En af de mere moderne anvendelser er det man kalder adaptive design. I dag foregår visningen af ens sider på mange devices, som f.eks. smartphones og tablet computere. Det layout man har til en almindelig computerskærm kan være uhensigtsmæssig til en lille skærm på en smartphone, hvorfor man gerne vil have andet layout til smartphones. Der kan også være en fordel i, at den måde siden udskrives på er forskellig fra den måde den vises på en skærm.

CSS er i praksis en lille fil med instruktion. Til tags har man attributten STYLE, hvor man definerer f.eks. farver og størrelser på elementer. I stedet for at skulle skrive det samme kode igen og igen, f.eks. at overskriften H1 skal være med fonten Arial, skriver man én gang i style sheetet, at tag'en H1 bruger Arial. Helt grundliggende gør style sheets ikke noget som man ikke kan gøre med attributten STYLE og syntaksen er nøjagtig den samme, det er ene og alene et spørgsmål om at gøre programmeringen lettere og mere overskuelig.

Filen lægger man et eller andet sted på hjemmesiden, jeg bruger f.eks. et directory der hedder StyleSheets til de fleste hjemmesider jeg laver, og i toppen af hver side på sitet, kalder man filen.

Det lyder simpelt, og det kan det også være, hvis man ikke bruger værktøjet til andet end simpel formatering. Moderne CSS, det der hedder CSS3, kan langt mere end det, idet man på flere tags og attributter har mulighed for at lave noget der ligner konditionel programmering dvs. hvis 1: gør sådan, hvis 2: gør sådan i stedet, så man f.eks. tager højde for at forskellige browsere skal have forskellige instrukser for at gøre den samme ting ved visse tags.