CSS

En nettside uten farger, form og design ville blitt kjedelig, lite brukervennlig og helt uten identitet. Her forklarer vi hva CSS er, og hvordan det fungerer.

Hva er CSS?

En nettside er bygget opp av kode, som for eksempel HTML, Javascript, PHP og CSS. Litt forenklet kan vi si at HTML-koden forteller nettleseren hva som skal stå på nettsiden, og CSS-koden forteller hvordan det hele skal se ut.

CSS står for “Cascading Style Sheets”, og er en egen fil som ligger sammen med de andre filene på serveren. Filen kan for eksempel hete “style.css”, og er lenket til fra HTML-koden slik at nettleseren skal finne den.

 

Hvordan fungerer CSS-koden?

Stilsettingen er bygget opp ved at man angir farger, størrelser og andre variabler til de ulike elementene i HTML-koden.

For eksempel blir hovedoverskriften angitt med <h1>CSS?</h1> i HTML-koden. I CSS-filen kan det for eksempel se sånn ut når man skal bestemme hovedoverskriftens utseende:

h1 {
font-size: 40px;
font-weight: bold;
font-color: red;
}

Vi har da fortalt nettleseren at hovedoverskriften skal ha størrelse 40px, ha fet skrift og være farget rød.

Man bruker i tillegg ulike “class” og “id”-navn for å kunne gi ulikt utseende til forskjellige enheter av samme type. For eksempel kan man gi ulik skriftstørrelse og farge til to underoverskrifter (h2-tag) ved å gi dem ulike navn i både HTML- og CSS-koden.

Uten CSS-filen hadde denne siden sett slik ut:

nettside-uten-css

 


 

 

Ofte stilte spørsmål:

Hva er CSS?
CSS er stilsettingen av en nettside. En nettside kan ha én eller flere CSS-filer som inneholder instruksjoner til nettleseren om hvordan tekst og designelementer skal se ut.

 

Hvordan lære CSS?
For å sikre at man lærer seg de nyeste standardene bør man bruke f.eks. https://www.w3schools.com/css/default.asp som kilde.