Media upiti u LESS
Hajde da napravimo funkciju koja će dodavati elementu media upit. Neka za primer ovo bude upit koji reguliše stilove za mobilne uređaje. Nazvaćemo našu funkciju shodno tome:
.mobile(@code) {
}
Naša funkcija će parametrom prihvatiti blok koda. Hajde da ispišemo ovaj blok unutar media upita:
.mobile(@code) {
@media (max-width: 600px) {
@code();
}
}
Sada ćemo iskoristiti našu funkciju:
div {
.mobile({
width: 300px;
});
}
Kao rezultat, nakon kompilacije, naš div će se naći unutar media upita, dobivajući odgovarajuće stilove:
@media (max-width: 600px) {
div {
width: 300px;
}
}
Napravite funkciju tablet koja postavlja
stilove za tablete.
Napravite funkciju gadget koja postavlja
stilove za mobilne telefone i tablete.
Napravite funkciju notebook koja postavlja
stilove za laptopove.
Napravite funkciju desktop koja postavlja
stilove za desktop računare.
