使用开发工具检查webkit-input-占位符

可以用下面的方法来设置文本输入的占位符:

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

我在网上看一个网站，我想使用相同的占位符颜色，因为他们做的。能查出他们用的是什么颜色吗?我想包括任何alpha值，所以我不能用图像编辑器对颜色进行采样。

当我用Chrome开发工具检查元素时，我看到:

在检查输入元素时，开发工具不会提供有关占位符元素的信息。还有别的办法吗?

我想明白了。

诀窍是在Chrome开发者工具的设置面板中启用“显示用户代理阴影DOM”:

要进行设置，单击开发工具面板右上方的齿轮图标，然后确保左侧的Preferences选项卡被选中，找到Elements标题，并选中该标题下面的“显示用户代理阴影DOM”复选框。

这样，你就可以看到:

2014-11-10 21:29:22

谷歌Chrome版本69: 打开Inspect Elements:在Mac⌘+ Shift + C上，在Windows / Linux上Ctrl + Shift + C或F12。点击右上方的“”按钮，然后进入设置在设置中单击Preferences >单击Show user agent Shadow DOM

下面的图片展示了这个过程:

转到设置>首选项:

点击显示用户代理阴影DOM:

查看占位符的CSS:

2018-09-18 06:52:16

使用开发工具检查webkit-input-占位符

推荐文章

最新文章

标签