Variabel Global di Dalam Selektor di SASS

Jika kita mendefinisikan variabel yang berada di dalam selektor, maka kita hanya dapat menggunakannya dalam batas tingkat bersarang yang ditentukan. Namun, jika kita perlu agar variabel dapat diakses secara global, maka kita menambahkan tanda !global ke nilainya. Mari kita lihat contoh:

styles.scssdiv {
  $height: 20px !global;
  height: $height;
}
#navbar {
  height: $height;
}

Hasil kompilasi dari kode yang diberikan akan menjadi seperti berikut:

styles.cssdiv {
  height: 20px; 
}
#navbar {
  height: 20px; 
}

styles.scss#main {
  $font-family: Arial !global;
  font-family: $font-family;
}
#navbar {
  font-family: $font-family;
}