Simon Willison·· 26 天前AI 评分22
Fable 5.1 Medium 详解：通过交互示例学习 Shadow roots
Shadow roots, explained with live examples
AI 导读
Fable 5.1 Medium 推出 Shadow roots 交互式教程，通过实例演示样式封装、继承、插槽、部分和 JavaScript 访问，展示如何通过 Shadow roots 创建隔离的 DOM 树，实现私有样式表和元素与页面 DOM 的特定、受控交互。
原文
Tool Shadow roots, explained with live examples — Learn about shadow DOM through interactive examples that demonstrate style encapsulation, inheritance, slots, parts, and JavaScript access. Explore how shadow roots create isolated DOM trees with private stylesheets and elements that interact with the page DOM in specific, controlled ways.
Prompt to Fable 5.1 Medium:
Build an artifact to explain shadow roots in CSS with interactive examples
来源：Simon Willison · simonwillison.net