Einführung in die Sprache SASS
In diesem Tutorial werden wir den Präprozessor SASS lernen. SASS ist eine Alternative zum Präprozessor LESS, der ebenfalls das Programmieren in CSS ermöglicht.
Tatsächlich hat SASS zwei Syntaxvarianten, die erste Variante heißt ebenfalls SASS, und die zweite - SCSS. Beide unterstützen den gleichen Funktionsumfang und unterscheiden sich nur leicht in der Syntax. Da SCSS jedoch die neuere und weit verbreitetere Variante ist, werden wir in diesem Tutorial genau diese lernen.
Die Syntax von SCSS ähnelt der CSS-Syntax,
das heißt, wir werden die gleichen geschweiften Klammern
und die gleichen Anführungszeichen mit Semikolon sehen wie in CSS.
Betrachten wir ein Beispiel für die SCSS-Syntax,
wo wir einer Variable eine Schriftart
und eine Farbe zuweisen und diese Variablen dann
den Eigenschaften im Selektor body zuweisen:
$font: Helvetica, sans-serif;
$color: #333;
body {
font: $font;
color: $color;
}