CodePen

New Pen
User Avatar of Rob Dodson

Rob Dodson

San Francisco, CA PRO

Web Components: Shadow DOM — Styles & Insertions 3 Pens

Using part attributes can you help distinguish the poisonous fruits from the good ones? Try changing the background color, or get creative!

Web Components: Imports 3 Pens

Imports load external documents into your page. They're the primary mechanism for sharing custom elements and templates.

Parisoma 4 Pens

A collection of Web Components exercises for the Oct. 30th Parisoma workshop!

Web Components: Polymer 2 Pens

Polymer is a collection of polyfills which allows us to use Web Components in all modern browsers! But it doesn't end there. Polymer is also a framework for building web applications which uses Web Components!

Web Components: Shadow DOM — Basics 3 Pens

Shadow DOM allows us to encapsulate blocks of HTML and CSS. It's the same technology that browser makers use when they implement tags like <video> or <textarea>.

Web Components: Templates 3 Pens

Templates are like scaffolding for your components. If you've worked with libraries like mustache or handlebars before then they should feel familiar. Templates are completely inert, so images will not make http requests and script blocks will not execute.