Beginning css preprocessors

Listing 1-18.  Example of Importing Content of One File into Another

@import 'reset';

body {

        background-color: #efefef;

}

 

■

Note   there is no need to specify the file extension while importing files in sass. sass automatically figures 

out the appropriate file and imports it.

In Less, however, the behavior of import varies per file extension. If the imported file has a .css 

extension, it will be treated as a normal CSS import and won’t be changed when compiled. If it has any other 

extension, it will be treated like Less and will be imported and merged.

Mixins

Mixins let you create snippets of CSS declarations that you can reuse throughout your stylesheet. Mixins are 

further configurable by passing parameters as well as setting defaults for those parameters. Mixins are most 

useful when you want to repeatedly use vendor-prefixed syntax. They reduce the tedious rewriting of code 

(see Listings 

1-19

 and 

1-20

).