Utdannets logo

Tekst og utseende

Lær typografi, bakgrunnsbilder, skygger, pseudo-elements, CSS-variabler og overganger i CSS. Gratis videoer og praktiske eksempler steg for steg.

Sist oppdatert

Har du noen gang åpnet en nettside og kjent at den ser «riktig» ut, uten helt å vite hvorfor? Ofte handler det om små valg i CSS som styrer tekst, farger, skygger og bevegelser, og sammen gir de siden personlighet. Her får du oversikten over verktøyene som former både uttrykket og lesbarheten på en side.

Tekst som er lett å lese

Typografi er en stor del av førsteinntrykket. Med font-family i CSS forklart velger du hvilke skrifttyper som skal brukes, mens font-size i CSS forklart hjelper deg å styre størrelse og hierarki i teksten.

Når du vil fremheve overskrifter, lenker eller ord i brødteksten, er text-decoration og text-transform i CSS nyttige verktøy. De påvirker både hvordan teksten ser ut og hvordan den oppleves for leseren.

Bakgrunner og dybde i designet

Utseendet på en side handler ikke bare om tekst. Med background-image i CSS forklart kan du legge inn bilder som bakgrunn og bygge stemning, mens box-shadow i CSS forklart gir elementer mer dybde og tydeligere skille fra resten av innholdet.

Slike detaljer gjør det enklere å styre hva som skal trekke oppmerksomhet, og hva som skal ligge mer i bakgrunnen.

Smartere styling med gjenbruk

Når du begynner å jobbe mer med større prosjekter, blir det nyttig å tenke på struktur i CSS. CSS-variabler (custom properties) forklart gjør det enklere å holde farger, størrelser og andre verdier samlet, slik at du kan endre uttrykket på flere steder samtidig.

Vil du også gjøre designet mer levende, kan CSS transition forklart hjelpe deg med å lage myke overganger når noe endrer seg på siden.

Når små detaljer gjør stor forskjell

Det er ofte kombinasjonen av tekst, bakgrunner, skygger og bevegelser som avgjør om en side føles enkel, ryddig og profesjonell. Pseudo-elementer er også nyttige når du vil legge til små visuelle detaljer uten å endre HTML-strukturen, og du kan lese mer i pseudo-elements i CSS forklart.

Når du utforsker disse temaene videre, får du bedre kontroll over både uttrykk og lesbarhet. Det gjør det lettere å bygge nettsider som ser gjennomtenkte ut, og som er gode å bruke.