Уводзіны ў мову SASS

У дадзеным дапаможніку мы будем вывучаць прэпрацэсар SASS. SASS — гэта альтэрнатыва прэпрацэсара LESS, які таксама дазваляе праграмаваць на CSS.

На самой справе SASS мае два варыянты сінтаксісу, першы варыянт таксама называецца SASS, а другі — SCSS. Абодва яны падтрымліваюць аднолькавы набор функцый і ўсяго крыху адрозніваюцца сінтаксісам. Аднак, паколькі SCSS з'яўляецца больш новым і шырока выкарыстоўваемым, у дадзеным дапаможніку мы будем вывучаць менавіта яго.

Такім чынам, сінтаксіс SCSS падобны на сінтаксіс CSS, гэта значыць мы ўбачым тыя ж фігурныя дужкі і тыя ж двукоссі з коскай, што і ў CSS. Разгледзім прыклад сінтаксісу SCSS, дзе адразу мы прысвойваем зменным шрыфт і колер, пасля чаго прысвойваем гэтыя зменныя ўласцівасцям у селектары body:

styles.scss$font: Helvetica, sans-serif;
$color: #333;

body {
  font: $font;
  color: $color;
}