Самое простое, что поддерживает SassScript - это использование переменных. Переменные начинаются со знака доллара $ и задаются как свойства CSS:

$width: 5em;

Вы можете обратиться к ним из свойств:

#main {
  width: $width;
}

Переменные доступны только в пределах того уровня вложенности селекторов, на котором они определены. Если они определяются вне каких-либо вложенных селекторов, они доступны глобально. Если вы хотите, чтобы объявленная на каком-либо уровне вложенности переменная также была доступна глобально, вы можете определить её со специальной меткой !global. Например:

#main {
  $width: 5em !global;
  width: $width;
}

#sidebar {
  width: $width;
}

компилируется в

#main {
  width: 5em;
}

#sidebar {
  width: 5em;
}

По историческим причинам, в именах переменных (и прочих Sass идентификаторах) дефисы и подчеркивания взаимозаменяемы. Например, если вы определяете переменную $main-width, вы можете получить к ней доступ, написав $main_width, и наоборот.



На сайте функционирует система проверки ошибок. Обнаружив неточность в тексте, выделите ее и нажмите Ctrl + Enter. Также отправить оповещение об ошибке можно, нажав на эту ссылку.