CSS Master

gem install sass

OSXandLinuxusersmayneedtousesudo.

Using Sass from the Command Line

AswithLess,youcanuseSassfromthecommandlinetocompileyourfilestoCSS.

Sassfilesshouldbesavedwithan.scssextension:

sass sassfile.scss output.css

Sass Syntaxes

Sasshastwosyntaxes:originalSasssyntaxandSCSS(orSassyCSS).Original

Sasssyntaxusesindentationratherthancurlybracestodelineaterulesets.SCSS

ismorelikeasupersetofplainCSS,andusescurlybraces.We’llbefocusingon

SCSS.FilesthatemployoriginalSasssyntaxshouldusea.sassextension.

Sassalsosupportsbasicminification.Justadd--style=compressedtoyoursass

command:

sass sassfile.scss output.css --style=compressed

Withthe--watchflag,SasscanalsoupdateCSSoutputaftereverysavedchange:

sass --watch sassfile.scss:output.css

Additionally,Sasscanwatchandoutputentiredirectoriesoffiles:

sass --watch /path/to/scss/:/path/to/css/

EachSassfileinawatcheddirectorywillbecompiledtoacorrespondingCSSone.

Nowthatwe’velookedathowtoinstallanduseLessandSass,let’sdigintothe

commonfeaturesofboth.

332 CSS Master