Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

YouTube

CSS Custom Properties - An Introduction to CSS Variables

Kevin Powell via YouTube

Overview

Coursera Flash Sale
40% Off Coursera Plus for 3 Months!
Grab it
Learn CSS custom properties (CSS variables) through a comprehensive video series that explores their functionality, implementation, and advanced applications. Discover how CSS variables work fundamentally and understand their advantages over preprocessors like Less and Sass, including capabilities that traditional preprocessors cannot achieve. Explore practical real-world applications and discover useful tricks for implementing CSS variables effectively in your projects. Compare CSS variables with Sass variables, particularly focusing on their behavior within media queries and understanding the key differences between these approaches. Master browser support strategies by learning how to implement proper fallbacks for older browsers that don't support CSS custom properties. Leverage Sass as a tool to create more robust fallback systems for CSS variables, ensuring broader compatibility across different browser versions. Gain hands-on experience manipulating CSS custom properties dynamically using JavaScript, opening up possibilities for interactive and responsive design patterns that respond to user interactions and application state changes.

Syllabus

CSS Variables - An introduction to CSS custom properties
CSS Variables - Using them in the real world and a cool trick
CSS Variables - CSS vs Sass - variables inside media queries
CSS Variables - Browser Fallbacks
CSS Variables - Sass to the rescue for fallbacks
CSS Variables - manipulating them with JavaScript

Taught by

Kevin Powell

Reviews

Start your review of CSS Custom Properties - An Introduction to CSS Variables

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.