Строки

CSS определяет два вида строк: будь то с кавычками, как "Lucida Grande" или 'https://sass-scss.ru', или же без них, как sans-serif или bold. SassScript признает оба вида строк и, в общем случае, какой тип строк вы используете в Sass документе, тот вы и получите в результирующем CSS. Существует одно исключение: когда используется #{} интерполяция, кавычки игнорируются. Это упрощает использование, скажем, имен селекторов в миксинах. Например:

@mixin firefox-message($selector) {
  body.firefox #{$selector}:before {
    content: "Hi, Firefox users!";
  }
}

@include firefox-message(".header");

@mixin firefox-message($selector)
  body.firefox #{$selector}:before
    content: "Hi, Firefox users!"

@include firefox-message(".header")

body.firefox .header:before {
  content: "Hi, Firefox users!";
}