LESS Mixins

LESS Mixins

Mixins sind vordefinierbare CSS Eigenschaften, die per Aufruf in die Klasse geladen werden kann. Es gibt 2 Arten von Mixins, die mitausgegeben werden und die nur im LESS vorhanden sind. Des weiteren ist es möglich Mixins Variablen zu übergeben um diese im Mixin zu verwenden.

ausgegebener Mixin

Compiliert den Mixin selbst mit.

generiert CSS:

Der Mixin ist nur in den LESS Dateien sichtbar.

generiert CSS:

Subelemente im Mixin

In Mixins können auch Subelemente definiert werden, des weiteren kann auch auf das Parent Element zugegriffen werden.

generiert CSS:

Parameterübergabe

An Mixins können Parameter übergeben werden und mit diesen dann im Mixin gearbeitet werden.

generiert CSS:

Default Wert

Bei Mixins mit Parametern können auch Defaultwerte mitgegeben werden, falls die Parameter leer sind.

generiert CSS:

!Important

Mit dem !important zusatz können alle Werte die vom Mixin übergeben werden auf !important gesetzt werden.

generiert CSS:

sinnvolles Beispiel für ein Mixin

Bei diesem Beispiel werden für alle Browser der Borderradius gesetzt.

generiert CSS:


wallpaper-1019588
1500 Kalorien am Tag – Ihr Plan fürs Abnehmen!
wallpaper-1019588
1500 Kalorien am Tag – Ihr Plan fürs Abnehmen!
wallpaper-1019588
Wenn das Neue lockt: Shiny New Object Syndrome im Online-Business
wallpaper-1019588
KiVVON: Der Game-Changer für Content-Creators