Zmienne w LESSie nie służą wyłącznie do nadawania im wartości właściwości, możemy równie dobrze użyć zmiennej do nazwania diva, podać w niej ścieżkę np. do obrazu lub importowanego pliku bądź możemy nadać zmiennej nazwę właściwości. Zmienna jako selektor Tworzymy sobie zmienną, która jest nazwą klasy naszego diva czyli przykładowo @naszSelektor: jakiśDiv;. Aby wykorzystać tą zmienną […]
Podczas tworzenia zmiennych pamiętajcie by ich nazwa była zrozumiała nie tylko dla Was ale także dla innych. Dodatkowo używajcie nazw angielskich (wiem, w kursie czasami są polskie nazwy, to tak tylko, żeby było wam łatwiej zrozumieć:)). No i najważniejsze, niech nazwa zmiennej wyraźnie określa czego dotyczy, więc przykładowo nie inicjujcie zmiennej @color wartością 45px; :) […]
Zmienne w LESS nie muszą być deklarowane przed ich użyciem, możemy zrobić to później a kompilator i tak sobie poradzi. Co nie zmienia faktu, że lepiej inicjować zmienne przed ich użyciem, dzięki czemu unikniemy bałaganu w kodzie.
|
1 2 3 4 5 6 |
.lazy-eval { width: @var; } @var: @a; @a: 9%; |
Jak widzicie w powyższym przykładzie najpierw odwołujemy się do zmiennej @var. Następnie inicjujemy zmienną @var wartością zmiennej […]
Gdy będziemy pracować na kilku plikach LESS lub korzystać z gotowej biblioteki jak np. Bootstrap to może się zdarzyć, że jakaś zmienna już się w nich pojawi. Nie jest to żaden problem. Po zaimportowaniu zewnętrznego pliku wystarczy nadać naszej zmiennej pożądaną wartość co spowoduje nadpisanie wartości występującej w importowanym pliku.
|
1 2 3 4 5 6 7 |
// zmienna w bibliotece @base-color: red; @dark-color: darken(@base-color, 10%); // import biblioteki @import "biblioteka.less"; @base-color: green; |
Jak widzicie, w bibliotece […]