Értékek összefűzése vesszővel LESS-ben
Tegyük fel, hogy van egy függvényünk, amely egy elem árnyékát hozza létre:
.shadow(@s) {
box-shadow: @s;
}
Tegyük fel, hogy két árnyékot szeretnénk hozzáadni az elemhez úgy, hogy kétszer hívjuk meg a függvényünket:
p {
.shadow(1px 1px red);
.shadow(2px 2px blue);
}
Azonban ez nem fog sikerülni, mivel
a két árnyék meghívása egyszerűen két
box-shadow tulajdonságot ad hozzá:
p {
box-shadow: 1px 1px red;
box-shadow: 2px 2px blue;
}
Mi viszont azt szeretnénk, ha az árnyékok
egyetlen box-shadow tulajdonsághoz lettek volna hozzáadva
vesszővel elválasztva,
így:
p {
box-shadow: 1px 1px red, 2px 2px blue;
}
Ahhoz, hogy a függvényünk a leírt módon
működjön, a tulajdonság értékét egy speciális
+: operátor után kell írni, így:
.shadow(@s) {
box-shadow+: @s;
}
Készítsen egy hasonló függvényt a
text-shadow tulajdonsághoz.
Készítsen egy hasonló függvényt a
background tulajdonsághoz.