Pilkulliset parametrit LESS:ssä
Oletetaan, että meillä on funktio, joka luo lohkon varjon:
.shadow(@s) {
box-shadow: @s;
}
Kuten näet, funktiossamme on yksi parametri. Tämä tarkoittaa, että välitämme tähän parametriin kaikki varjomme arvot välilyönnillä, näin:
div {
.shadow(1px 1px red);
}
CSS:ssä voidaan kuitenkin asettaa useita varjoja kirjoittamalla ne pilkulla erotettuna. Meidän tapauksessamme tämä valitettavasti ei onnistu, koska pilkku tulkitaan kääntäjän funktioparametrien erottimena:
div {
.shadow(1px 1px red, 1px 1px blue); // aiheuttaa virheen
}
Kuitenkin on olemassa keino. Voimme pakottaa LESS:n tulkitsemaan merkkijonomme pilkulla yhdeksi parametriksi. Tätä varten meidän on päättävä luettelo arvoistamme puolipisteellä:
div {
.shadow(1px 1px red, 1px 1px blue;);
}
Tee funktio, joka lisää taustan. Käytä tätä funktiota lisätäksesi lohkoon useita taustoja.