从 Chrome 开发人员工具样式更改输入占位符颜色答案

【问题标题】：Change input placeholder color from the Chrome Developer Tools style从 Chrome 开发人员工具样式更改输入占位符颜色
【发布时间】：2017-04-13 16:01:57
【问题描述】：

我用蓝色字体颜色和红色placeholder 做了一个input，

现在我想通过 Chrome 开发者工具 (F12) 检查其他 placeholder 颜色，就像我可以为字体颜色做的一样 -

我怎样才能为 placeholder 获得相同的 Chrome 开发人员工具颜色选择器？

input[type="text"] {
    color: blue;
}

::-webkit-input-placeholder {
   color: red;
}

&lt;input type="text" placeholder="Type Here"&gt;

【问题讨论】：

【解决方案1】：

如果我理解你的话，你想在 Chrome 开发者工具中拥有颜色选择器，就像字体一样。为此，请按以下步骤操作：

现在您可以像修改字体颜色一样修改规则。我希望这是您想要实现的目标

【讨论】：

【解决方案2】：

要在 Chrome 开发工具中查看和操作 ::placeholder 样式，您可以启用 Show user agent shadow DOM 设置。它可以在 ⚙️ > Preferences > Elements 下的 devtools 设置中找到。

2021 年的问候

【讨论】：