Variabler i SASS

SASS-sproget tillader brugen af variabler. En variabel er en container, hvor man kan gemme data og bruge dem på de ønskede steder i koden.

For at oprette en variabel skal du finde på et navn for den og sætte tegnet $ foran. Derefter sætter vi et kolon efter variabelnavnet og angiver værdien af denne variabel. Lad os som eksempel lave en variabel med navnet var:

styles.scss$var: 20px;

Lad os nu bruge denne variabel som værdi for en egenskab:

styles.scssp {
  font-size: $var;
}

Som resultat efter kompilering til CSS vil variablens værdi blive substitueret i stedet for variablen:

styles.cssp {
  font-size: 20px;
}

styles.scss$color: #000;

p {
  color: $color;
}