当我在密码输入中重置：：占位符的样式时，它会在Chrome上变成点

Question

我正在使用all： unseton

超文本标记语言：

<input type="password" placeholder="text of placeholder">

CSS：

::placeholder {
    all: unset;
}

占位符的错误视觉结果：

有没有办法仍然使用all： unset并返回将正确显示的占位符值？

代码笔示例




Answer 1

尝试-webkit-text-Security：初始；（https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-text-security）

css prettyprint-override">.reset-input::placeholder {
  all: unset;
  -webkit-text-security: initial;
}

<label>Reset Input</label>
<input class="reset-input" type="password" placeholder="placeholder text">

<br><br>

<label>UnReset Input</label>
<input type="password" placeholder="placeholder text">