Sass Tutorial
SASS is an extension of CSS. It is also known as CSS pre-processor.
SASS (Syntactically Awesome Stylesheet) is a CSS pre-processor, which help to
- Reduce repetition with CSS. You don't need to repeat similar CSS again and again in your project
- Saves the time.
It is more stable and powerful CSS extension language that describes the style of document structurally. Sass is completely compatible with all versions of CSS. you can seamlessly use any available CSS libraries.
Sass Example
$bgcolor: lightblue;
$textcolor: darkblue;
$fontsize: 18px;
body
{
background-color: $bgcolor;
color:
$textcolor;
font-size: $fontsize;
}
History
Sass was initially designed by Hampton Catlin and developed by Natalie Weizenbaum in 2006. After the initial development, Natalie Weizenbaum and Chris Eppstein continue with its initial version and extend Sass with SassScript, a simple scripting language used in Sass files.
Features of Sass
- Sass is fully CSS-compatible.
- It is more stable, powerful and elegant than CSS.
- It is based on JavaScript and is superset of CSS.
- It has its own syntax and compiles to readable CSS.
- It is an open-source pre processor that is interpreted into CSS.
- It supports language extensions such as variables, nesting, and mixins.
- It provides many useful functions for manipulating colors and other values.
- It provides many advanced features like control directives for libraries.
- It provides well-formatted, customizable output.
Sass Quiz
Test your Sass skills with a quiz.
Sass Quiz
Advertisements