Nối giá trị bằng dấu phẩy trong LESS

Giả sử chúng ta có một hàm tạo bóng cho khối:

styles.less.shadow(@s) {
  box-shadow: @s;
}

Giả sử chúng ta muốn thêm hai bóng cho khối bằng cách gọi hàm của chúng ta hai lần:

styles.lessp {
  .shadow(1px 1px red); 
  .shadow(2px 2px blue);
}

Tuy nhiên, chúng ta sẽ không đạt được điều gì, bởi vì gọi hai bóng đơn giản sẽ chỉ thêm hai thuộc tính box-shadow:

styles.cssp {
  box-shadow: 1px 1px red;
  box-shadow: 2px 2px blue;
}

Trong khi chúng ta muốn các bóng được thêm vào một thuộc tính box-shadow duy nhất và phân tách bằng dấu phẩy, như thế này:

styles.cssp {
  box-shadow: 1px 1px red, 2px 2px blue;
}

Để hàm của chúng ta hoạt động theo cách đã mô tả, cần viết giá trị của thuộc tính sau toán tử đặc biệt +:, như thế này:

styles.less.shadow(@s) {
  box-shadow+: @s;
}