Что значит # означает в SCSS?

Question

У меня есть пример кода. #

.#{$item} { 
    background: $item; 
    } 

Я не могу найти что-нибудь на Google, кроме другого примера

$fa-css-prefix: fa; 
.#{$fa-css-prefix} { ... } 

Что это означает?

Answer 1

Есть две части в этом выражении, . является селектор класса CSS, #{}interpolation синтаксис это позволяет использование переменных в селекторов и имен свойств

$name: foo; 
$attr: border; 
p.#{$name} { 
    #{$attr}-color: blue; 
} 

сгенерировано css:

p.foo { 
    border-color: blue; } 

Answer 2

The. На самом деле это имя класса и не связано с #. #{$name} - выводить имя переменной в экранированном формате. В случае, если переменная имела такие символы, как dash sass, она не будет рассматривать ее как вычитание.

Вот пример: Using SASS, How can I escape the slash character in a font declaration?