Original sass
is ruby syntax-like, similar to ruby, jade etc...
In those syntaxes, we don't use {}
, instead we go with white spaces, also no usage of ;
...
In scss
syntaxes are more like CSS
, but with getting more options like: nesting, declaring, etc, similar to less
and other pre-processing CSS
...
They basically do the same thing, but I put couple of lines of each to see the syntax difference, look at the {}
, ;
, and spaces
:
SASS:
$width: 100px
$color: green
div
width: $width
background-color: $color
SCSS:
$width: 100px;
$color: green;
div {
width: $width;
background-color: $color;
}