Introdução à linguagem SASS
Neste tutorial, estudaremos o pré-processador SASS. SASS é uma alternativa ao pré-processador LESS, que também permite programar em CSS.
Na verdade, o SASS tem duas variantes de sintaxe, a primeira também é chamada de SASS, e a segunda é SCSS. Ambos suportam o mesmo conjunto de funcionalidades e diferem apenas ligeiramente na sintaxe. No entanto, como o SCSS é mais novo e amplamente utilizado, neste tutorial estudaremos especificamente ele.
Assim, a sintaxe SCSS é semelhante à sintaxe CSS,
ou seja, veremos as mesmas chaves
e as mesmas aspas com ponto e vírgula que no CSS.
Vejamos um exemplo de sintaxe SCSS,
onde primeiro atribuímos a variáveis a fonte
e a cor, e depois atribuímos essas variáveis
às propriedades no seletor body:
$font: Helvetica, sans-serif;
$color: #333;
body {
font: $font;
color: $color;
}