The ::shadow selector was a deprecated Shadow DOM CSS selector for piercing a shadow boundary and styling elements inside a component. It belonged to Shadow DOM v0, never reached v1, and was removed from Chrome in version 63. section 10.0 section 10.2
Its behavior was deliberately narrow:
- A rule such as ::shadow .example { color: red; } styled matching elements inside a component using Shadow DOM. section 10.2
- The selector did not style an element with the same class outside the shadow tree. section 10.2
- The related /deep/ selector was used when matching should cross the boundary more broadly, but both selectors were deprecated. section 10.2
Styling inside a component
Given <my-component><div class="example">Some red text</div></my-component>, ::shadow .example { color: red; } targeted the internal div. A separate <div class="example"> outside the component remained unaffected. section 10.2
::shadow .example {
color: red;
}
Inspect the minimal ::shadow rule and compare it with the component markup that supplies the shadow-internal target. section 10.2
