Find placeholder pseudo style in google chrome devtools

旧城冷巷雨未停 提交于 2019-12-11 16:39:54

问题


I want to test my placeholder style in chrome devtools but can't find it.

I tried to use the "Toggle Element State" but it provides only

  1. :hover
  2. :active
  3. :focus-within
  4. :focus
  5. :visited

These are my css lines:

    .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>

回答1:


Showing user agent Shadow DOM does the trick.

After enabling this setting, expand the #shadow-root section. The placeholder shows up as a div.



来源:https://stackoverflow.com/questions/54107662/find-placeholder-pseudo-style-in-google-chrome-devtools

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!