Parâmetros com vírgulas em LESS
Suponha que temos uma função que cria uma sombra de caixa:
.shadow(@s) {
box-shadow: @s;
}
Como você pode ver, nossa função tem um parâmetro. Isso significa que vamos passar para este parâmetro todos os valores da nossa sombra separados por espaço, assim:
div {
.shadow(1px 1px red);
}
No CSS, no entanto, é possível definir várias sombras, escrevendo-as separadas por vírgula. No nosso caso, infelizmente, isso não funcionará, porque a vírgula será interpretada pelo compilador como um separador entre os parâmetros da função:
div {
.shadow(1px 1px red, 1px 1px blue); // retornará um erro
}
No entanto, há uma solução. Podemos forçar o LESS a interpretar nossa string com vírgula como um único parâmetro. Para fazer isso, precisamos finalizar a lista dos nossos valores com ponto e vírgula:
div {
.shadow(1px 1px red, 1px 1px blue;);
}
Crie uma função que adiciona um plano de fundo. Usando essa função, adicione vários planos de fundo a um bloco.