css to sass code example

Example 1: sass vs scss

/* Answer to: "sass vs scss" */

/*
  The basic difference is the syntax. While SASS has a loose syntax
  with white space and no semicolons, the SCSS resembles more to CSS.
  SASS stands for Syntactically Awesome StyleSheets. It is an
  extension of CSS that adds power and elegance to the basic
  language.
  
  There's more differences but too much for me! Fortunately, someone
  else asked the same question over in StackOverflow! Here's a link
  to their answer:
  https://stackoverflow.com/questions/5654447/whats-the-difference-between-scss-and-sass
*/

Example 2: sass to scss

# You can do it with SASS itself 
# Nevermind these malware infested sites below
sass-convert style.sass style.scss

Example 3: css sass scss

/*SMART DIFFERENCE*/
/*CSS*/
body {
  font: 100% Helvetica, sans-serif;
  color: #333;
}

/*SCSS*/

$font-stack:    Helvetica, sans-serif;
$primary-color: #333;

body {
  font: 100% $font-stack;
  color: $primary-color;
}


/*SASS*/
$font-stack:    Helvetica, sans-serif
$primary-color: #333

body
  font: 100% $font-stack
  color: $primary-color

Example 4: scss to css

In Visual Studio Code use this extension: "Live Sass Compiler"

Tags:

Shell Example

Recent Posts