Funkciók a LESS-ben

Ebben a leckében megvizsgáljuk, hogyan kell használni a funkciókat. A funkciók némileg hasonlítanak a mixinekhez, de lehetővé teszik paraméterek hozzáadását, amelyek értékeik megváltoztathatnak.

Ezeket a paramétereket a funkció kerek zárójelében adjuk át. Nézzük meg egy példán.

Készítsünk egy fs funkciót, amely beállítja a betűméretet. Legyen a méret paraméterként átadva. A paraméterként egy változó fog szolgálni, melynek nevét mi találjuk ki a funkció deklarálásakor:

styles.less.fs(@size) {
  // itt lesz a funkció kódja
}

Adjunk meg a funkción belül, hogy hová kell beilleszteni a paraméterünk értékét:

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

Hívjuk meg a funkciónkat, átadva neki a kívánt méretet az elem számára:

styles.lessp {
  .fs(20px);
}

Ennek eredményeképpen a fordítás után a betűméret a bekezdésnél egyenlő lesz a megadott értékkel:

styles.cssp {
  font-size: 20px;
}