在 google chrome devtools 中查找占位符伪样式

Question

我想在 chrome devtools 中测试我的占位符样式，但找不到它。

我尝试使用“切换元素状态”，但它仅提供

1. ：徘徊
2. ：积极的
3. :焦点内
4. ：重点
5. :访问过

这些是我的 css 行：

    .inputs-wrapper input[type="text"]::placeholder ,
    .inputs-wrapper input[type="tel"]::placeholder{

        font-weight:900;
        color:black;

    }

html：

<div class="inputs-wrapper">
    <input type="text" placeholder="?? ???"/>
    <input type="tel" placeholder="?????"/>
    <input type="submit" value="???? > " />
</div>

Answer 1

显示用户代理 Shadow DOM可以解决问题。

启用此设置后，展开该#shadow-root部分。占位符显示为div.