Johdatus SASS-kieleen
Tässä oppaassa opimme SASS-esiprosessoria. SASS on vaihtoehto LESS-esiprosessorille, joka myös mahdollistaa ohjelmoinnin CSS:llä.
Itse asiassa SASS:lla on kaksi syntaksivaihtoehtoa, ensimmäistä vaihtoehtoa kutsutaan myös SASS:ksi ja toista SCSS:ksi. Molemmat tukevat samaa toimintojoukkoa ja eroavat vain hieman syntaksiltaan. Koska SCSS on kuitenkin uudempi ja laajemmin käytetty, opimme tässä oppaassa nimenomaan sitä.
Eli SCSS-syntaksi muistuttaa CSS-syntaksia,
eli näemme samat aaltosulkeet
ja lainausmerkit pilkuilla kuin CSS:ssä.
Tarkastellaan esimerkkiä SCSS-syntaksista,
missä annamme muuttujille fontin
ja värin, minkä jälkeen annamme nämä muuttujat
ominaisuuksille body-valitsimessa:
$font: Helvetica, sans-serif;
$color: #333;
body {
font: $font;
color: $color;
}
