Funksies in LESS

In hierdie les sal ons kyk hoe om funksies te gebruik. Funksies is ietwat soortgelyk aan mixins, maar laat toe dat parameters bygevoeg word, wat hul waardes kan verander.

Hierdie parameters word in die ronde hakies van die funksie oorgedra. Kom ons kyk na 'n voorbeeld.

Kom ons maak 'n funksie fs wat die lettergrootte sal stel. Laat die grootte deur 'n parameter oorgedra word. Die parameter sal 'n veranderlike wees, waarvan ons die naam bedink wanneer ons die funksie verklaar:

.fs(@grootte) {
	// hier sal die funksie se kode wees
}

Kom ons spesifiseer binne die funksie waar die waarde van ons parameter ingevoeg moet word:

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

Kom ons roep ons funksie aan, en dra die gewenste grootte van die element as parameter aan dit oor:

p {
	.fs(20px);
}

As gevolg hiervan sal die lettergrootte van die paragraaf na die kompilasie gelyk wees aan die gespesifiseerde waarde:

p {
	font-size: 20px;
}

Maak 'n funksie w() wat die wydte van 'n element sal stel.

Maak 'n funksie h() wat die hoogte van 'n element sal stel.