Пусть у нас есть функция, создающая тень блока:
.shadow(@s) {
box-shadow: @s;
}
Пусть мы хотим добавить две тени блоку, вызвав нашу функцию два раза:
p {
.shadow(1px 1px red);
.shadow(2px 2px blue);
}
У нас, однако, ничего не получится, ведь
вызов двух теней просто добавит два свойства
box-shadow
:
p {
box-shadow: 1px 1px red;
box-shadow: 2px 2px blue;
}
А мы бы хотели, чтобы тени были добавлены
в одно свойство box-shadow
через запятую,
вот так:
p {
box-shadow: 1px 1px red, 2px 2px blue;
}
Для того, чтобы наша функция работала описанным
образом, нужно значение свойства писать после
специального оператора +:
, вот так:
.shadow(@s) {
box-shadow+: @s;
}
Сделайте аналогичную функцию для свойства
text-shadow
.
Сделайте аналогичную функцию для свойства
background
.