Komma-separeret sammenkædning i LESS
Lad os sige, at vi har en funktion, der skaber en skygge for en blok:
.shadow(@s) {
box-shadow: @s;
}
Lad os sige, at vi vil tilføje to skygger til en blok ved at kalde vores funktion to gange:
p {
.shadow(1px 1px red);
.shadow(2px 2px blue);
}
Det vil dog ikke lykkes for os, fordi
at kalde to skygger blot vil tilføje to
box-shadow egenskaber:
p {
box-shadow: 1px 1px red;
box-shadow: 2px 2px blue;
}
Men vi ville ønske, at skyggerne blev tilføjet
til én enkelt box-shadow egenskab adskilt af komma,
sådan her:
p {
box-shadow: 1px 1px red, 2px 2px blue;
}
For at vores funktion skal fungere på den beskrevne
måde, skal egenskabsværdien skrives efter
en speciel operator +:, sådan her:
.shadow(@s) {
box-shadow+: @s;
}
Lav en tilsvarende funktion for egenskaben
text-shadow.
Lav en tilsvarende funktion for egenskaben
background.