Was ist LESS?

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 kompiliert zu:

header {
    color: red;
}

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