Extending CSS3 with Sass and Less Overview/Description Target Audience Prerequisites Expected Duration Lesson Objectives Course Number Expertise Level Overview/Description
Despite its increasing flexibility and functionality, CSS does not include functionality such as nesting, functions, and the use of variables. Sass and Less pre-processors can be used to extend CSS, providing greater functionality and power and maintenance for your stylesheets.
Target Audience
Developers with knowledge of CSS3 who wish to learn how to extend the functionality of CSS with the Sass and Less pre-processors
Prerequisites
none
Expected Duration (hours)
1.6
Lesson Objectives Extending CSS3 with Sass and Less
start the course
outline the features of Sass and how to install and use it, outline Sass syntax and create a Sass stylesheet
outline the features of SassScript - variables, data types, operations, and use the interactive shell to work with SassScript
work with nested CSS rules and reference parent selectors using Sass
work with nested CSS properties in Sass
use the @import rule in Sass, use partials and nested @imports
use nested @media queries
use the @extend directive in Sass
use the @extend directive for multiple and chained extends
use control directives in Sass
use the @at-root directive in Sass
use the @warn and @debug directives in Sass
use @mixin in Sass
work with functions in Sass
use Sass to extend CSS3
describe Less, and how it can be used; install and use Less
work with variables in Less
work with the Extend pseudo-class in Less
work with mixins in Less
pass rulesets to mixins in Less
use recursive mixins to create loop structures in Less
work with mixin guards and CSS guards in Less
work with import directives in Less
use & to reference parent selectors and to generate selectors in a list
use Less to extend CSS3
Course Number: wd_cssh_a06_it_enus
Expertise Level
Expert