Tham số có dấu phẩy trong LESS
Giả sử chúng ta có một hàm tạo đổ bóng cho khối:
.shadow(@s) {
box-shadow: @s;
}
Như bạn thấy, hàm của chúng ta có một tham số. Điều này có nghĩa là chúng ta sẽ truyền tất cả giá trị đổ bóng của mình vào tham số này thông qua dấu cách, như thế này:
div {
.shadow(1px 1px red);
}
Tuy nhiên, trong CSS, có thể đặt nhiều đổ bóng, ghi chúng cách nhau bằng dấu phẩy. Trong trường hợp của chúng ta, than ôi, điều đó sẽ không hoạt động, vì dấu phẩy sẽ được trình biên dịch hiểu là dấu phân cách giữa các tham số của hàm:
div {
.shadow(1px 1px red, 1px 1px blue); // sẽ báo lỗi
}
Tuy nhiên, có một cách giải quyết. Chúng ta có thể buộc LESS hiểu chuỗi của chúng ta có dấu phẩy như một tham số duy nhất. Để làm điều này, cần kết thúc liệt kê giá trị của chúng ta bằng dấu chấm phẩy:
div {
.shadow(1px 1px red, 1px 1px blue;);
}
Hãy tạo một hàm thêm nền. Sử dụng hàm này để thêm nhiều nền cho một khối.