Introduction to SASS

What is SASS?

SASS is a extension language that allows you to describe your stylesheets(CSS) in a concise way - in addition to extending CSS with a number of useful features and abilities.

SASS can easily be integrated with both Sinatra and Ruby on Rails - giving you powerful access to SASS for dealing with CSS.

To give you a taste — here is a HTML body with some styles:

body
  color: #34495E
  font-size: 18px
  margin: 0
  padding: 0
  background-color: white
  font-family: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif

Styling hyperlinks:

a
  text-decoration: underline
  color: #34495E

Describing a class for a .box-container:

.box-container
  padding: 60px
  border: solid 3px #DDD
  background-color: #F5F5F5

Assigning some style to a HTML element with an ID of #menu-bar:

#menu-bar
  color: white
  background-color: #F5F5F5
  margin-bottom: 25px

Learn more

Learn SASS on sass-lang.com

CSS is for Suckers. An Introduction to Sass & Compass

Screencast: Introduction to Sass

CSS Tricks ScreencastLea