Mixins Mixins mogą być utożsamiane z funkcjami, których wywołanie powoduje wstawienie pewnego bloku kodu w miejsce wywołania. Składnia mixins wygląda identycznie jak definicja klasy lub selektora dla ID w CSS, a wywołanie to po prostu nazwa mixin, zakończona opcjonalnie pustym nawiasem okrągłym.
Przykład .a, #b { color: red; } h1 { .a(); } h2 { #b; } Po przetworzeniu do CSS, powyższy kod wyglądał będzie tak: .a, #b { color: red; } h1 { color: red; } h2 { color: red; }
Argumenty Mixins pozwalają na przekazywanie argumentów. Deklaracja mixin zmienia się wtedy – po nazwie pojawia się nawias z deklaracją zmiennej lub zmiennych oddzielonych średnikami (lub przecinkami, choć jest to niezalecane). Nawias może być pusty – mixin nie przyjmuje wtedy żadnych argumentów, ale nie pojawia się wtedy w wynikowym kodzie CSS jako klasa lub ID.
Przykład .size(@width; @height: 100px) { width: @width; height: @height; } .color() { color: red; } img { .size(50px); .color; } Wynikowy CSS: img { width: 50px; height: 100px; color: red; }
Zwracana wartość W języku Less nie ma instrukcji return.