Last updated - July 8, 2021
Quick Overview of what is covered:
Digging the Features
- Extend
- Mixins
- Functions
- Nesting
- Variables
- Operations
5 Reasons to Use CSS Preprocessors
- Use CSS3 with ease
- Easy to set-up and maintain
- Organize & scale CSS quickly
- Write reusable and less codes
- Optimize CSS for production use
Top CSS Preprocessors
- Sass 38.67%
- Scss 28.67%
- Less 22.67%
- Compass 8%
- Stylus 4%
How to Use CSS Preprocessors with WordPress
Step 1: Install Sass and Compass
- Method 1: Using Command lines
$ npm install -g sass
$ gem install compass - Method 2: Compile using Editors
- Codekit
- Koala
- Scout-App
- Compass.app
Step 2: Copy SASS files into your theme folder
Step 3: Compile and convert style.scss to style.css
$ compass watch
The infographic is brought to you by Prevent Direct Access Gold Team.
