如何在 Chrome 开发者工具中检查原生控件的影子 DOM？

Question

我想设计一个本机输入元素的样式，它在 Chrome 中有一个影子根并且可以使用许多伪选择器进行样式设计。显然可以在开发者工具中看到影子根，并且我被告知它看起来像这样：

但是，我看不到这个影子根（在 Chrome 118 中）。 如何在开发者工具中查看shadow root？

Answer 1

在开发者工具设置中：

.

但是你不能设置样式

(user-agent)

ShadowDOM