LESS: Variablen

LESS ist eine Erweiterung für CSS und ist deswegen nicht nur Abwärtskompatibel, sondern die zusätzlichen Features nutzen ebenso CSS Syntax. Dadurch wird das Lernen von LESS ein Kinderspiel. Und notfalls kann man immer noch CSS verwenden.
Variablen

Das ist so ziemlich selbsterklärend:

@nice-blue: #5B83AD;

#header { color: @nice-blue; }
    

Wird zu:

#header { color: #5B83AD; }
    

Wenn eine Variable doppelt definiert wird, wird die letzte Definition verwendet indem vom aktuellen Geltungsbereich nach oben gesucht wird. Zum Beispiel:

@var: 0;
.class1
  @var: 1;
  .class {
    @var: 2;
    three: @var;
    @var: 3;
  }
  one: @var;
}
    

Wird zu:

.class1 .class {
  three: 3;
}
.class {
  one: 1;
}
    

Dies ist ähnlich wie bei CSS selbst wo immer das letzte definierte Attribut ausschlaggebend ist.