We frequently incorporate frameworks such as Bootstrap with our rails application. For going beyond the standard CSS, We require CSS preprocessors. They not only enhance the standard CSS but also provide several other useful functionalities such as nesting of rules,use of variables and mixins.
here are two popular CSS preprocessors.
First is LESS. Bootstrap is written in LESS .
Second is SASS. We'll concentrate on this second CSS preprocessor.
There are two variants or flavours of SASS varying mainly on the delimiter style.
In SASS itself, We use whitespace to nest CSS rules and semicolons are not there. e.g.
This file would produce the following code after compilation.