css - 更改占位符的字体系列

输入字段是否可以具有一个字体家族，而占位符又可以另一个字体家族？

我试图用CSS中已定义的@ font-face更改输入的占位符的字体系列，但是它不起作用

CSS

.mainLoginInput::-webkit-input-placeholder {
  font-family: 'myFont', Arial, Helvetica, sans-serif;
}

.mainLoginInput:-moz-placeholder {
  font-family: 'myFont', Arial, Helvetica, sans-serif;
}

HTML

<input class="mainLoginInput" type="text" placeholder="Username"  />

我该如何解决这个问题？

最佳答案

如果有人想要所有浏览器的占位符选择器:

.mainLoginInput::-webkit-input-placeholder {
  font-family: 'myFont', Arial, Helvetica, sans-serif;
}

.mainLoginInput:-ms-input-placeholder {
  font-family: 'myFont', Arial, Helvetica, sans-serif;
}

.mainLoginInput:-moz-placeholder {
  font-family: 'myFont', Arial, Helvetica, sans-serif;
}

.mainLoginInput::-moz-placeholder {
  font-family: 'myFont', Arial, Helvetica, sans-serif;
}