LESS Variablen

LESS Variablen

In LESS können Variablen erstellt werden, in diese man z.B. URL's, Farbwerte oder Abstände speichern kann um eine höhere Wartbarkeit zu schaffen. Eine Variable fängt mit einem @ an, danach folgt der Name und ein Doppelpunkt, der Inhalt der Variable und ein Semikolon. Bei doppelten Namen wird der zuletzt verwendete Inhalt benutzt.

Variable

Variable definieren:

Variable verwenden:

generierte folgendes CSS:

Variablennamen doppelt verwenden

Es wird immer der zuletzt zugewiesene Werte in einer Verschachtelung verwendet.

generierte folgendes CSS:

Wirkungsbereich

Wenn Variablen in einer Klasse definiert werden, sind diese auch nur dort gültig.

Gibt folgenden Fehler in der Konsole aus:

NameError: variable @colorred is undefined

Es ist aber egal ob die Variable vor oder nach der Klasse definiert wird, da die Variablen erst compiliert werden und dann eingesetzt.

generierte folgendes CSS:

Klassennamen in Varibalen speichern

Es ist möglich Klassennamen in Variablen zu speichern und zu verwenden.

generierte folgendes CSS:

Variablen können verknüpft werden, dann erhalten beide Variablen dauerhaft den gleichen Wert.

generierte folgendes CSS:

generierte folgendes CSS:

Variablen in Funktionen

Wenn Variablen in Funktionen verwendet werden, wird wieder der zuletzt gespeicherte Wert verwendet.

generierte folgendes CSS:


wallpaper-1019588
Die neue glutenfreie Starterbox der FoodOase – Unsere Vorstellung und Verlosung
wallpaper-1019588
Wer ist Arbeitnehmer?
wallpaper-1019588
Übernahmeangebot für Aktien der NORDWEST Handel AG (EUR 18,25 je Aktie)
wallpaper-1019588
Oldtimer-Treffen in Schwangau - und mein Baujahr war nicht dabei!
wallpaper-1019588
Fabienne leistet ganze Arbeit
wallpaper-1019588
Lions Club Mariazell – Aktuelle Infos
wallpaper-1019588
Forgive me. | #berlinspiriert #berlin #blog #blogger #potd #notesofberlin #sticker #art #urbanjungle #urbanromantix #igersberlin #ig_berlin #ig_berlincity #berlinlove #berlinlife #street #streetview #streetart #mood #forgiveness #forgiveme #imsorry #im...
wallpaper-1019588
Rotterdam mit Kindern