Funzioni in LESS

In questa lezione esamineremo come utilizzare le funzioni. Le funzioni sono in qualche modo simili ai mixin, ma permettono di aggiungere parametri, che possono cambiare i loro valori.

Questi parametri vengono passati tra parentesi tonde della funzione. Vediamo un esempio.

Creiamo una funzione fs, che imposterà la dimensione del font. Lasciamo che la dimensione venga passata come parametro. Come parametro agirà una variabile, il cui nome ideiamo alla dichiarazione della funzione:

.fs(@size) {
	// qui sarà il codice della funzione
}

Specifichiamo all'interno della funzione, dove deve essere inserito il valore del nostro parametro:

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

Chiamiamo la nostra funzione, passandole come parametro la dimensione desiderata dell'elemento:

p {
	.fs(20px);
}

Di conseguenza, dopo la compilazione, la dimensione del font del paragrafo diventerà uguale al valore specificato:

p {
	font-size: 20px;
}

Crea una funzione w(), che imposterà la larghezza dell'elemento.

Crea una funzione h(), che imposterà l'altezza dell'elemento.