Sass syntax
Sass supports two different syntaxes: the original indented Sass syntax and the SCSS syntax, which is basically a superset of regular CSS. The SCSS syntax is the easiest one for beginners, the most popular one, and the one used for the Bootstrap styles. It’s also the one that I will be using throughout this book. However, both of these different syntaxes support the same features of Sass.
Comparison between the original Sass syntax and the modern Sass syntax
The original syntax uses the .sass
file extension. It uses indentation instead of curly braces to separate code blocks, and newline characters (every time you hit the Enter key) to separate rules within a code block.
The indented syntax looks like this:
.link
background-color: #aaa
&:hover
text-decoration: underline
&__icon
color: #fff
The modern syntax uses the .scss
file extension...