LESS tutorial logo

Domieszki (Mixins)

autor: Robert

28 stycznia 2015

Domieszki jak sugeruje nazwa pozwalają „dołożyć” coś do naszych stylów. Są one swego rodzaju agregatorami często wykorzystywanych właściwości (coś jak klasy CSS z tym, że jedną domieszkę można umieścić wewnątrz drugiej domieszki).

Przykładowo, chcemy stworzyć sobie diva z zaokrąglonymi rogami. Jak wiemy, w tym przypadku, musimy stworzyć trzy właściwości CSS z odpowiednimi prefiksami:

Zamiast za każdym razem kopiować te trzy elementy, tworzymy sobie domieszkę, którą dołączymy do innych właściwości naszego elementu np:

A następnie wykorzystamy ją podczas stylowania naszego diva:

Po kompilacji naszego pliku LESS do pliku CSS otrzymamy co następuje:

Jak widzicie, domieszka podczas kompilacji „domieszała” swoją zawartość do innych właściwości stylu dla naszego diva.

Oczywiście domieszki mogą pobierać parametry, zmienne oraz inne domieszki ale o tym w późniejszych rozdziałach.


Komentarze: Bądź pierwszy!