Páginas

martes, 5 de noviembre de 2013

Funciones y más funciones:

Todas las funciones:



escape(@string);               // URL codifica una cadena
e(@string);                    // escapa el contenido de una cadena
%(@string, values...);         // formatea un string

unit(@dimension, [@unit: ""]); // elimina o cambia la unidad de una dimensión
color(@string);                // parsea un string a un color
data-uri([mimetype,] url);       // * codifica un recurso y devuelve la url()

ceil(@number);                 // redondea hacia arriba un entero
floor(@number);                // redondea hacia abajo un entero
percentage(@number);           // convierte un número en un porcentaje %, por ejemplo 0.5 -> 50%
round(number, [places: 0]);    // redondea un número un número de posiciones
sqrt(number);                  // * calcula la raiz cuadrada de un número
abs(number);                   // * valor absoluto de un número
sin(number);                   // * función seno
asin(number);                  // * función arcoseno - inversa del seno
cos(number);                   // * función coseno
acos(number);                  // * función arcocoseno - inverso de coseno
tan(number);                   // * función tangente
atan(number);                  // * función arcotangente - inverso de tangente
pi();                          // * devuelve pi
pow(@base, @exponent);     // * primer argumento elevado al segundo argumento
mod(number, number);       // * resto de la división entre el primer argumento y el segundo
convert(number, units);    // * conversión entre tipos de números
unit(number, units);       // * cambio de unidades sin convertir el número
color(string);             // convierte un string o un valor de escape en un color

rgb(@r, @g, @b);                             // convierte en un color
rgba(@r, @g, @b, @a);                        // convierte en un color
argb(@color);                                // crea un #AARRGGBB
hsl(@hue, @saturation, @lightness);          // crea un color
hsla(@hue, @saturation, @lightness, @alpha); // crea un color
hsv(@hue, @saturation, @value);              // crea un color
hsva(@hue, @saturation, @value, @alpha);     // crea un color

hue(@color);           // devuelve el tono de @color en el espacio HSL
saturation(@color);    // devuelve la saturación de @color en el espacio HSL
lightness(@color);     // devuelve la luminosidad de @color en el espacio HSL
hsvhue(@color);        // * devuelve el tono de @color en el espacio HSV
hsvsaturation(@color); // * devuelve la saturación de @color en el espacio HSV
hsvvalue(@color);      // * devuelve la luminosidad de @color en el espacio HSV
red(@color);           // devuelve el canal rojo de @color
green(@color);         // devuelve el canal verde de @color
blue(@color);          // devuelve el canal azul de @color
alpha(@color);         // devuelve el canal alfa de @color
luma(@color);          // devuelve la luma (brillo porceptual) de @color

saturate(@color, 10%);                  // devuelve un color un 10% *más* saturado
desaturate(@color, 10%);                // devuelve un color un 10% *menos* saturado
lighten(@color, 10%);                   // devuelve un color un 10% *más iluminado*
darken(@color, 10%);                    // devuelve un color un 10% *más oscuro*
fadein(@color, 10%);                    // devuelve un color un 10% *menos" transparente
fadeout(@color, 10%);                   // devuelve un color un 10% *mas* transparente
fade(@color, 50%);                      // devuelve @color con una transparencia del 50%
spin(@color, 10);                       // devuelve un color con 10 grados mas de tono
mix(@color1, @color2, [@weight: 50%]);  // devuelve la mezcla de @color1 y @color2
tint(@color, 10%);                      // devuelve un color mezclado con blanco al 10%
shade(@color, 10%);                     // devuelve un color mezclado con negro al 10%
greyscale(@color);                      // devuelve el color en la escala de grises, 100% desaturado
contrast(@color1, [@darkcolor: black], [@lightcolor: white], [@threshold: 43%]);
                                        // devuelve @darkcolor si @color1 es > 43% de luma
                                        // en otro caso devuelve @lightcolor, ver notas

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);              // devuelve true si se le pasa un color, incluyendo las palabras claves de colores
isnumber(@numberOrAnything);            // devuelve true si se le pasa un numero en cualquier unidad
isstring(@stringOrAnything);            // devuelve true si se le pasa un string
iskeyword(@keywordOrAnything);          // devuelve true si se le pasa una palabra clave
isurl(@urlOrAnything);                  // devuelve true si se le pasa una url
ispixel(@pixelOrAnything);              // devuelve true si se le pasa una dimension en px
ispercentage(@percentageOrAnything);    // devuelve true si se le pasa una dimension en %
isem(@emOrAnything);                    // devuelve true si se le pasa una dimension en em
isunit(@numberOrAnything, "rem");       // * devuelve true si el primer parametro es un numero y esta en la unidad especificada

// * Estas funciones solo están disponibles en la versión 1.4.0 beta

No olvideis visitar el site original. http://amatellanes.github.io/lesscss.org/
Allí podréis encontrar una explicación más extensa acerca de estas funciones.

http://jdalebrook.es/

No hay comentarios:

Publicar un comentario