Hands on Responsive Design Using a CSS Preprocessor
Build a mobile first, responsive website using the power of a CSS preprocessor so you can use variables, functions, calculations, shorthand, and minification in your web design workflow.
What you'll learn
CSS is very basic and tedious to write by hand. However, by using a CSS preprocessor, we can introduce variables, functions, calculations, shorthand, minification, and other cool stuff all while keeping our source files clean and readable. The power of using a CSS preprocessor for doing responsive design should not be underestimated.
Table of contents
CSS Preprocessor Overview
Introduction to SASS
Setting up a New SASS Project
Building the Site Header
Building the Main Rows and Columns
Building the Tabbed Navigation
Style Lists with Custom Bullets
Build Newspaper Style Columns
Using a for Loop for a 12 Column Grid