Bit of SASS - Part 2

Written by Mahabub I.

CSS Preprocessor is new Pie in world of Web Development. And in my last post I started about a beautiful preprocessor named SASS. And this is another part after last post.

So , Lets get to the point.

There is some features in SASS like , mixin , with this mixin you can write down function like css snippet . Which can be used with argument or without it. Like,


@mixin color($color,$back-color){


//And to include it 

	@include color(#fff,#777);

Which will output,


So , it is a charm isn’t it? And here is another smashing stuff you will love. You can use and manipulate css flow with control-statements like

Well , this can take your css works in to whole new level. Let me give a little example,

	  @if 1 + 1 == 2 { border: 1px solid;  }
	  @if 5 < 3      { border: 2px dotted; }
	  @if null       { border: 3px double; }


  	  border: 1px solid; 

Just try to imagin how much power is on your hand if you start to manipulate the CSS sheet with Control statements. Whole power is up to you .

Maybe next time I can talk about another CSS Preprossecor named LESS. Which is also fun to work with. Until then take care.

Written by : Mahabub Islam

Done At: Feb 4,2015