Funciones en LESS

En esta lección veremos cómo utilizar funciones. Las funciones son algo similares a los mixins, pero permiten agregar parámetros, que pueden cambiar sus valores.

Estos parámetros se pasan entre paréntesis de la función. Veamos un ejemplo.

Hagamos una función fs, que establecerá el tamaño de fuente. Deje que el tamaño se pase como parámetro. Como parámetro actuará una variable, cuyo nombre inventamos al declarar la función:

.fs(@size) {
	// aquí irá el código de la función
}

Especificamos dentro de la función, dónde debe insertarse el valor de nuestro parámetro:

.fs(@size) {
	font-size: @size;
}

Llamemos a nuestra función, pasándole como parámetro el tamaño deseado del elemento:

p {
	.fs(20px);
}

Como resultado, después de la compilación el tamaño de fuente del párrafo será igual al valor especificado:

p {
	font-size: 20px;
}

Cree una función w(), que establecerá el ancho del elemento.

Cree una función h(), que establecerá la altura del elemento.