CSS Pre-processor

  • Scripting language that extends CSS by allowing developers to write code in one language and then compile it into CSS
  • Examples:
    • SASS (Syntactically Awesome Stylesheet)
      • old syntax is called SASS (uses indentation)
      • new syntax is called SCSS (Sassy CSS) (uses curly brackets)
        • Any CSS is automatically SCSS
    • LESS (Leaner Stylesheet)

CSS Post-processor

  • These tools make the existing CSS and make it more better:
    • Add fallback for older browsers
    • Add vendor specific prefixes
  • Examples:
    • AutoPrefixer
    • PostCSS

Resetting vs Normalizing CSS

  • Resetting:
    • removes all default browser styling on elements.
  • Normalizing:
    • preserves useful default styles rather than “unstyling” everything.
  • It’s a good idea to choose resetting when you have very a customized or unconventional site design