Web Component 的目的从`原生层面实现组件化，使开发者开发、复用、扩展自定义组，实现自定义标签`。意味着前端开发人员开发组件时可以实现 Write once, run anywhere。

今天我们通过使用具名 Slots 在 Templates 中占位，然后再在自定义元素中给 Slots 传值，提高自定义元素的灵活性。

理论知识基本上够用了，从现在开始我们需要将理论运用到实践中，让理论为实践服务，使用 Web Components 的相关知识来实现 MyCard 的制作。

-`:host` 范围最大，匹配所有的自定义元素实例； -`:host()` 只选择自身包含特定选择器的自定义元素； - `:host-context()` 选择拥有特定选择器父元素的自定义元素。

通过前面的学习，对自定义组件的相关概念和知识点也有了一定了解，今天我们就来学习一下给自定义元素及其子元素设置样式的几种方法。

为了使 Custom Elements 在使用上更加灵活，它也有”生命周期“回调函数，可以让开发者定义好在组件不同生命时期可以被执行的方法。

以上就是我对 Slots 相关知识的一个总结，目前能想到的就这些，肯定不全面，希望大家能够指正补充！

Templates 可以将一些页面内容事先封装并且保存在 HTML 页面上，且不进行渲染，随后可以使用 JS 来操作 Templates。

影子当然都是藏在暗处，不容易让人发现的，就像文章开头提到的那些默认元素，如果不通过设置，我们表面上看到的就是简单的一个标签而已。