LESS bietet eine Vielzahl an Funktionen die Farben transformieren, Strings verändern und Mathematische Funktionen ausführen. Sie sind vollständig in der Funktionsreferenz dokumentiert.
Using them is pretty straightforward. The following example uses percentage to convert 0.5 to 50%, increases the saturation of a base color by 5% and then sets the background color to one that is lightened by 25% and spun by 8 degrees: Die Verwendung ist recht einfach. Das folgende Beispiel verwendet Prozente um 0.5 in 50% umzuwandeln, erhöht die Sättigung einer Grundfarbe um 5% und setzt die Hintergrundfarbe auf eine Farbe die um 25% heller und um 8 Grad gedreht ist:
@base: #f04615; @width: 0.5;
.class { width: percentage(0.5); // ergibt 50% color: saturate(@base, 5%); background-color: spin(lighten(@base, 25%), 8); }
escape(@string); // Ein URL kodierter String
ceil(@number); // Rundet auf zu einem Integer
floor(@number); // Rundet ab zu einem Integer
percentage(@number); // Konvertiert zu %, z.B. 0.5 -> 50%
round(number, [places: 0]); // Rundet eine Zahl zu einer Zahl mit places Nachkommastellen
rgb(@r, @g, @b); // Konvertiert zu einer Farbe
rgba(@r, @g, @b, @a); // Konvertiert zu einer Farbe
argb(@color); // Erstellt: #AARRGGBB
hsl(@hue, @saturation, @lightness); // Erstellt eine Farbe
hsla(@hue, @saturation, @lightness, @alpha); // Erstellt eine Farbe
hsv(@hue, @saturation, @value); // Erstellt eine Farbe
hsva(@hue, @saturation, @value, @alpha); // Erstellt eine Farbe
hue(@color); // Gibt den `Farbton` von @color zurück
saturation(@color); // Gibt den `Sättigungs` Kanal von @color zurück
lightness(@color); // Gibt den 'Helligkeits' Kanal von @color zurück
red(@color); // Gibt den 'roten' Kanal von @color zurück
green(@color); // Gibt den 'grünen' Kanal von @color zurück
blue(@color); // Gibt den 'blauen' Kanal von @color zurück
alpha(@color); // Gibt den 'alpha' Kanal von @color zurück
luma(@color); // Gibt den 'luma' Wert (wahrgenommene Helligkeit) von @color zurück
saturate(@color, 10%); // Gibt eine Farbe zurück, die 10% Punkte *mehr* gesättigt ist
desaturate(@color, 10%); // Gibt eine Farbe zurück, die 10% Punkte *weniger* gesättigt ist
lighten(@color, 10%); // Gibt eine Farbe zurück, die 10% Punkte *heller* ist
darken(@color, 10%); // Gibt eine Farbe zurück, die 10% Punkte *dunkler* ist
fadein(@color, 10%); // Gibt eine Farbe zurück, die 10% Punkte *weniger* transparent ist
fadeout(@color, 10%); // Gibt eine Farbe zurück, die 10% Punkte *mehr* transparent ist
fade(@color, 50%); // Gibt @color mit 50% Transparenz zurück
spin(@color, 10); // Gibt @color mit 10 Grad höherem Farbton zurück
mix(@color1, @color2, [@weight: 50%]); // Gibt einen Mix aus @color1 und @color2 zurück
greyscale(@color); // Gibt einen Grauton, eine zu 100% entsättigte Farbe zurück
contrast(@color1, @darkcolor, @lightcolor);
// Gibt @darkcolor zurück, wenn @color1 mehr als 43% Luma hat
// ansonsten gib $lightcolor zurück
multiply(@color1, @color2);
screen(@color1, @color2);
overlay(@color1, @color2);
softlight(@color1, @color2);
hardlight(@color1, @color2);
difference(@color1, @color2);
exclusion(@color1, @color2);
average(@color1, @color2);
negation(@color1, @color2);
iscolor(@colorOrAnything); // Gibt true zurück, wenn Sie eine Farbe übergeben
isnumber(@numberOrAnything); // Gibt true zurück, wenn Sie eine Zahl übergeben
isstring(@stringOrAnything); // Gibt true zurück, wenn Sie einen String übergeben
iskeyword(@keywordOrAnything); // Gibt true zurück, wenn Sie ein Stichwort übergeben
isurl(@urlOrAnything); // Gibt true zurück, wenn Sie eine URL übergeben
ispixel(@pixelOrAnything); // Gibt true zurück, wenn es eine Zahl und ein Pixel ist
ispercentage(@percentageOrAnything); // Gibt true zurück, wenn es eine Zahl und a % ist
isem(@emOrAnything); // Gibt true zurück, wenn es eine Zahl und em ist
[bra_list style=“colored-counter-list“]
- String Funktionen
- Mathematische Funktionen
- Farbfunktionen
- Farbkanal Information
- Farboperationen
[/bra_list]