null

O valor null é o único valor do seu tipo. Ele representa a ausência de um valor, e é frequentemente retornado pelas funções para indicar a falta de um resultado.

SCSS Syntax

@use "sass:map";
@use "sass:string";

@debug string.index("Helvetica Neue", "Roboto"); // null
@debug map.get(("large": 20px), "small"); // null
@debug &; // null

Se um lista conter um null, este null é omitido da CSS gerada.

SCSS Syntax

$fonts: ("serif": "Helvetica Neue", "monospace": "Consolas");

h3 {
  font: 18px bold map-get($fonts, "sans");
}

Se um valor de propriedade for null, esta propriedade é omitida completamente.

SCSS Syntax

$fonts: ("serif": "Helvetica Neue", "monospace": "Consolas");

h3 {
  font: {
    size: 18px;
    weight: bold;
    family: map-get($fonts, "sans");
  }
}

null também é falso, o que significa que conta como false para quaisquer regras ou operadores que recebem booleanos. Isto torna fácil usar valores que podem ser null como condições para @if e if():

SCSS Syntax

@mixin app-background($color) {
  #{if(&, '&.app-background', '.app-background')} {
    background-color: $color;
    color: rgba(#fff, 0.75);
  }
}

@include app-background(#036);

.sidebar {
  @include app-background(#c6538c);
}