Paramètres avec virgules dans LESS
Supposons que nous ayons une fonction créant une ombre de bloc :
.shadow(@s) {
box-shadow: @s;
}
Comme vous le voyez, notre fonction a un paramètre. Cela signifie que nous allons passer à ce paramètre toutes les valeurs de notre ombre par un espace, comme ceci :
div {
.shadow(1px 1px red);
}
En CSS, cependant, il est possible de définir plusieurs ombres en les écrivant séparées par des virgules. Dans notre cas, hélas, cela ne fonctionnera pas, car la virgule sera interprétée par le compilateur comme un séparateur entre les paramètres de la fonction :
div {
.shadow(1px 1px red, 1px 1px blue); // générera une erreur
}
Il existe cependant une solution. Nous pouvons forcer LESS à interpréter notre chaîne avec une virgule comme un seul paramètre. Pour cela, il faut terminer la liste de nos valeurs par un point-virgule :
div {
.shadow(1px 1px red, 1px 1px blue;);
}
Créez une fonction ajoutant un arrière-plan. En utilisant cette fonction, ajoutez plusieurs arrière-plans à un bloc.