这个css不适用于mozilla

Question

我正在尝试使用:placeholder css伪选择器。 我如何在Firefox中执行此操作？

input::-moz-placeholder {
  color: #f00;
  transition: all 0.3s;
}
input:focus:-moz-placeholder {
  color: #1abc9c;
  font-size: 11px;
  transform: translateY(-20px);
}

<input type="text" placeholder="test" />

Answer 1

在你的问题中你并没有真正说清楚，但我认为你的意思是不起作用是改变＆＃34;：焦点＆＃34;。但是，您刚刚忘记了伪选择器:focus::-moz-placeholder前面的第二个冒号。如果你添加它，它的工作原理如下：

＆＃13;

＆＃13;

input::-moz-placeholder {
  color: #f00;
  transition: all 0.3s;
}
input:focus::-moz-placeholder {
  color: #1abc9c;
  font-size: 11px;
  transform: translateY(-20px);
}

＆＃13;

<input type="text" placeholder="test" />

＆＃13;

＆＃13;

＆＃13;