Example
To concatenate the value of two or more variables into a single string and print it as the output, we need to make use of interpolation.
The following Less code,
#demo:after {
@var1: Hello;
@var2: World!!!;
content: "@{var1} @{var2}";
}
when compiled would set "Hello World!!!" as value to the content property. Below is the compiled CSS:
#demo:after {
content: "Hello World!!!";
}
If the value of two or more variables just need to be placed next to each other in space separated manner then interpolation is not required.
#demo {
@top: 4px;
@right: 2px;
@bottom: 6px;
@left: 4px;
padding: @top @right @bottom @left;
}
When the above code is compiled, it would produce the following CSS.
#demo {
padding: 4px 2px 6px 4px;
}
This approach will not work when there should be no space between the variable values (or) when the resultant string needs to be within quotes. For those cases, usage of interpolation would be mandatory.
