Event details
Sass is the most mature, stable, and powerful professional grade CSS extension language in the world. Sass lets you use features that don't exist in CSS yet like variables, nesting, mixins, inheritance and other nifty goodies that make writing CSS fun again. Once you start tinkering with Sass, it will take your preprocessed Sass file and save it out as a normal CSS file that you can use in your web site. This one-day course covers Sass and Compass (a CSS authoring framework for Sass) development essentials. Whether you're developing a static site, a dynamic site with a CMS (Drupal), or building an advanced web-based application, you'll find that Sass is an indispensable tool for taming and optimizing your CSS.
Duration: 1 days
Course Prerequisites
To gain the most from this class, you should already have:
- A basic understanding of CSS syntax
- Familiariaty with basic programming concepts such as defining variables and using functions
- Course Objectives
During this course you will refactor a very long and difficult to maintain CSS file into a set of .scss (Sassy CSS) files. You'll learn how to restructure your CSS for optimal maintainabilty and produce minified production builds. You'll also learn how to use advanced CSS tricks such as base-64 encoding of images to significantly increase the performance of your web sites and web applications.
Course Outline
UNIT 1: INTRODUCING THE COURSE
UNIT 2: INTRODUCING SASS
Introducing Compass and Sass
Debugging CSS
Working with Variables
Using Partials to Organize your Stylesheet
UNIT 3: WORKING WITH SASS
Nesting Rules
Creating Responsive Themes with @media Directives
Defining Inheritance with @extend
Defining and Invoking Mixins
Using Control Directives
Defining Sass Functions
UNIT 4: USING COMPASS FOR COMPATIBILITY AND PERFORMANCE
Configuring Browser Support
Using Compass to Support CSS3 Features
Using Compass for Typography
Embedding Images in your Stylesheet
Using Sprites to Improve Performance
Online This is an online event.
