November 26, 2010

Sass why it’s useful

By Pablo Ifran

Sass is used for generating css files based on his own syntax, it’s very useful because allows you to avoid repeating code across the different scss files using import (allows you to import code from other scss file), or mixins(scss functions). Also, allows you to write varibles, for using in different scss, this makes easier to do different templates based on colors or images for example.

_sprites.scss

default.scss

That generates

default.css

So, this is best sorted using this method, because you have the image path in a single file and you use it in other files only by importing the file with the images path, it’s also simpler to remove an image because you only need to find the references to that variable and delete them.

The sass framework also allows you to use the DRY principle because you can write nested selector, I’ll show you with an example:

default.scss

default.css

Doesn’t affect the performance because it generates a css file at development time.

It also allows you to benefit from some of the advantages of css 3 right now.