Interpolation #{$var}

Definition

Syntaxe #{} qui insere la valeur d'une variable dans un selecteur, un nom de propriete, ou une chaine. Necessaire la ou Sass n'attend pas une expression.

Analogie

Un trou dans un texte a trous : tu inseres dynamiquement le mot qui manque.

Exemple de code

$side: 'left';
$component: 'card';

.#{$component} {
  margin-#{$side}: 1rem;
  background: url('/img/#{$component}.png');
}

Cas d'usage

Generer dynamiquement des selecteurs ou proprietes dans des boucles et des mixins.

Termes lies