3min chapter

Syntax - Tasty Web Development Treats cover image

Supper Club × Web Components and Lit with Justin Fagnani of Google

Syntax - Tasty Web Development Treats

CHAPTER

How to Use CSS in Web Components

Shadow DOM is kind of responsible for all the heavy lifting here. Shadow DOM gives you a scope so if you put a style tag into the DOM inside of a shadow root. Those styles do not leak out of that shadow root so they don't leave above the component meaning like the components ancestors. Inherited CSS properties do inherit across the shadow down boundary. The contents of its nested children right they can style the child but not the child shadow children. And so that's just in the platform it's runtime encapsulationYou don't need a compiler you don't need to agree to like, you know, monitor the class names or use them or anything like that.

00:00

Get the Snipd
podcast app

Unlock the knowledge in podcasts with the podcast player of the future.
App store bannerPlay store banner

AI-powered
podcast player

Listen to all your favourite podcasts with AI-powered features

Discover
highlights

Listen to the best highlights from the podcasts you love and dive into the full episode

Save any
moment

Hear something you like? Tap your headphones to save it with AI-generated key takeaways

Share
& Export

Send highlights to Twitter, WhatsApp or export them to Notion, Readwise & more

AI-powered
podcast player

Listen to all your favourite podcasts with AI-powered features

Discover
highlights

Listen to the best highlights from the podcasts you love and dive into the full episode