CSS Variables. What Do They Know? Do They Know Things?? Let's Find Out!
summary
Explains that CSS custom properties are real-time, dynamic CSS values usable only inside CSS properties, not in class names or at-rules, and that they work inside functions like calc() and gradients but URL() rejects variables so the whole property computes to initial. Demonstrates using calc() to attach units, shows SVG styling works when attributes are CSS properties and that <use> inheritance can style shadowed symbols, and stresses that fallbacks only for undeclared variables, not for values invalid at computed time.
AI-written summary · about
chapters (18)
- 0:00Introduction and setup
- 1:30Who am I and CSS background
- 3:19CSS variables vs preprocessors
- 9:32CSS variables are just CSS
- 10:19Quiz begins valid CSS?
- 11:45Quiz min-width property
- 12:50Quiz padding with variables
- 15:25Quiz calc function
- 17:15Quiz gradient backgrounds
- 17:36Quiz background fallback
- 23:24Quiz cascading variables
- 26:01Quiz fallback behavior
- 28:28Quiz valid CSS values
- 29:18Quiz CSS data types
- 30:22Quiz SVG and variables
- 31:08Quiz shadow DOM styling
- 32:16Summary of findings
- 33:19Q&A and closing
