Глобальные переменные внутри селекторов в SASS
Если мы задаем переменные, находящиеся
внутри селекторов, то использовать их
мы сможем только пределах заданного уровня
вложенности. Однако, если нам нужно,
чтобы переменная была доступна
глобально, то мы дописываем к ее
значению метку !global.
Рассмотрим пример:
div {
$height: 20px !global;
height: $height;
}
#navbar {
height: $height;
}
Результат компиляции приведенного кода будет следующим:
div {
height: 20px;
}
#navbar {
height: 20px;
}
Расскажите, каким будет результат компиляции следующего кода:
#main {
$font-family: Arial !global;
font-family: $font-family;
}
#navbar {
font-family: $font-family;
}