Avoiding individual parameters to leverage the @arguments variable

In the Less code, the @arguments variable has a special meaning inside mixins. The @arguments variable contains all arguments passed to the mixin. In this recipe, you will use the @arguments variable together with the the CSS url() function to set a background image for a selector.

Getting ready

You can inspect the compiled CSS code in this recipe after compiling the Less code with the command-line lessc compiler. Alternatively, you can inspect the results in your browser using the client-side less.js compiler. When inspecting the result in your browser, you will also need an example image that can be used as a background image. Use your favorite text editor to create and edit the Less files used in this recipe.

How to do it…

1. Create a background.less file that contains the following Less code:

   .background(@color; @image; @repeat: no-repeat; @position: top right;) 
   { 
     background: @arguments; 
   } 
   div { 
     .background(#000; url...