Was ist LESS?

Erklärung

LESS ist ein Präprozessor für die Stylesheet-Sprache CSS. Das Ziel von Less ist es, CSS effizienter zu gestalten und Code-Wiederholungen zu vermeiden. In Less kann unter anderem mit Variablen, Mixins, Berechnungen und Funktionen gearbeitet werden.

Beispiel:

@color: red;

.rounded (@radius: 4px;) {
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
  border-radius: @radius;
}

header {
  color: @color;

  .btn {
    background: @color;
    .rounded;
  }
}

Wird kompilliert zu:

header {
  color: red;
}

header .btn {
  background-color: red;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}