Sass – Syntactically Awesome Stylesheets

Sass är kort och gott CSS fast mycket bättre. Sass är även något som jag håller på att börja använda mer och mer i och med att jag just nu lär mig Symfony2.

För att bara dra ett enkelt exempel så kan du jämföra Sass med CSS syntax. Här så demonstreras hur du kan använda dig av variablar i Sass:

 /* Sass */

$blue: #3bbfce
$margin: 16px

.content-navigation
  border-color: $blue
  color: darken($blue, 9%)

.border
  padding: $margin / 2
  margin: $margin / 2
  border-color: $blue


/* CSS */

.content-navigation {
  border-color: #3bbfce;
  color: #2b9eab;
}

.border {
  padding: 8px;
  margin: 8px;
  border-color: #3bbfce;
}

Jag kommer personligen börja använda det mycket mer framöver för det känns som det kommer spara massor av tid och det är betydligt lättare att läsa och ändra i än CSS.