占位符显示类型=数字的奇怪行为 - Firefox

Question

在输入标记上使用:placeholder-shown属性，选择占位符文本可见时的状态。这可以在谷歌浏览器上按预期工作，带有文本输入框和数字输入框。

Google Chrome：

在<input type=number>字段上使用时，Firefox似乎忽略此属性

火狐：

问题：为什么会发生这种情况，如何解决？

演示片段

input:placeholder-shown {
    background: #000;
}

<input placeholder="example">
<input placeholder="example" value="12345">
<br>
<input placeholder="example" type="number">
<input placeholder="example" type="number" value="12345">

Answer 1

firefox上不支持RefCell<T>类型=“数字”，类型=“时间”等等。

以下是refrence

但您可以使用:placeholder-shown

解决此问题

请参阅以下代码：

::-moz-placeholder

input:placeholder-shown {
    background: #000;
}
input::-moz-placeholder {
  background: #000;
  color: #ddd;
  opacity: 1;
}