What is Sass?• CSS preprocessor written in Ruby• Compiles to regular CSS• Adds many helpful features to CSS…Official Documentation:http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html
What is Compass?• An extension of Sass• Contains many CSS3 helpers used in modern web development.• Adds many helpful features to CSS…Official Documentation:http://compass-style.org/reference/compass/
@importProperties can be imported from otherSass files.
Tips for using @import• Put common properties in external file• Different than using @import in CSS• Imported files should begin with an “_”
@importSCSS CSS output// Loads Compass CSS3 helpers /*@import compass/css3; Loads all helpers from Compass’ CSS3 modules and makes it// Loads user defined files available to the rest of our project.@import base;@import reset; Imports the “_base.scss” file and then imports the “_reset.scss” file . */
@mixin• Small piece of code that is used to build something larger• Define once and use anywhere• Can accept arguments and parameters• Used via the @include keyword