You can use the .lib-url('images/fallback.png');
function, this example is taken from the core in lib/web/css/source/lib/_utilities.less
.
.column.left {
.lib-url('images/fallback.png');
background:url("@{url}") repeat-y;
}
.columns {
.lib-url('images/fallback.png', 'Magento_Catalog');
background:url("@{url}") repeat;
}
This is the function, it returns the path you specified with the base URL prepended and optionally accepts a second argument which is a module.
// File - lib/web/css/source/lib/_utilities.less
.lib-url(@_path) {
@url: "@{baseDir}@{_path}";
}
.lib-url(
@_path,
@_module
) when not (@_module = false) and not (@_module = '') and (@urls-resolved = false) {
@url: "@{_module}::@{_path}";
}
.lib-url(
@_path,
@_module
) when not (@_module = false) and not (@_module = '') and (@urls-resolved = true) {
@url: "@{baseDir}@{_module}/@{_path}";
}
This function uses the @baseDir variable and optionally accepts a second argument which is a module: which is declared in lib/web/css/source/lib/_variables.less
@baseDir: "../";