Summary  
This chapter explains how to declare and use variables in Sass for storing and reusing style values, making code more maintainable and easy to update.

General domain of usage  
CSS preprocessing in front-end web development

Den første nyttige funktion er eksistensen af variabler. Vi kan gemme og genbruge værdier gennem koden. Det minder meget om programmeringssprog, hvor man kan oprette en variabel én gang og bruge den flere gange. For at erklære en variabel skal vi sætte et dollartegn (`$`) foran variabelnavnet, derefter et kolon (`:`) og tildele en værdi.
```css
$textPrimaryColor: #49423c;
```

>Note
>
> Vi kan bruge enhver navngivningsnotation, uanset om det er kebab case (`text-primary-color`), snake case (`text_primary_color`) eller camel case (`textPrimaryColor`). Det vigtigste er at bruge den samme navngivningsnotation gennem hele projektet.

Forestil dig, at vi skal oprette et markup, hvor al tekstfarve skal være `#474943` og skriftstørrelsen skal være `24px`. Sass-filen vil se således ud:
```css
$textColor: #474943;
$textFontSize: 24px;

p {
  color: $textColor;
  font-size: $textFontSize;
}
```

Vi holder altid variabler så beskrivende som muligt, så vi kan sikre, hvad hver variabel er ansvarlig for.

Fordelen er, at det gør det nemt at foretage designændringer i projektet senere. Hvis tekstens skriftstørrelse eller farve ændres, kan vi opdatere værdien af variablerne `$textColor` og `$textFontSize`, og projektet vil blive opdateret tilsvarende.

Ved hjælp af hvilket tegn erklærer vi en sass-variabel?

Opgradér dine stylingfærdigheder ved at mestre avancerede CSS-teknikker til moderne webdesign. Positionér og håndter elementer med præcision ved hjælp af avancerede positioneringsstrategier. Skab glidende overgange og engagerende animationer for at forbedre brugeroplevelsen. Transformér og manipuler elementer for dynamiske visuelle effekter. Byg responsive designs, der tilpasser sig på tværs af enheder, og lær at effektivisere din arbejdsgang med CSS preprocessorer som Sass.

Undersøg, hvad deltagerne kan forvente af dette kursus i avanceret HTML og CSS-styling. Hvilke forudsætninger kræves, før du starter kurset? Hvilke emner vil blive dækket?

Placering og håndtering af elementer på websider. Lær om de forskellige positioneringsegenskaber, opdag hvordan stablingsrækkefølgen bruges til at kontrollere synligheden af overlappende elementer, og håndter til sidst indholds-overløb.

Undersøg styrken ved overgange og lær, hvordan brugeroplevelsen kan forbedres. Opdag, hvordan egenskaber kan animeres glidende og gradvist for at skabe sømløse tilstandsskift.

Lær om animation-egenskaben, og hvordan den kan bruges til at skabe dynamiske og engagerende designs. Opdag, hvordan man opretter komplekse animationer ved hjælp af keyframes, og hvordan man styrer animationen.

Undersøg transform-egenskaben, som muliggør ændring af udseende og placering af elementer på en webside. Lær hvordan man skalerer, roterer, skæver og flytter elementer i to og tre dimensioner. Kombinér flere transformationer for at skabe mere komplekse effekter.

Principperne og teknikkerne, der anvendes i adaptivt/responsivt design, har til formål at gøre websites og applikationer tilgængelige og visuelt tiltalende på tværs af forskellige enheder, skærmstørrelser og orienteringer.

Lær om præprocessorer i CSS, og hvordan de kan hjælpe med at skrive mere effektiv og vedligeholdelsesvenlig kode. Forstå, hvordan præprocessorer kan forenkle arbejdsgangen og generere mere overskuelig CSS-kode.

Brug af Sass-Variabler til Genanvendelige Stilarter

Awesome!

Brug af Sass-Variabler til Genanvendelige Stilarter