如何更改占位符字体

时间:2018-10-28 21:53:19

标签: css

我当前正在尝试为用户ID和密码字段更改占位符的字体。我在下面添加了css,它更改了用户ID占位符字体,但没有更改密码占位符字体,我不确定为什么。

有帮助吗?

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  font-family: 'helveticaneueregular', sans-serif !important;
}
::-moz-placeholder { /* Firefox 19+ */
      font-family: 'helveticaneueregular', sans-serif !important;
}
:-ms-input-placeholder { /* IE 10+ */
      font-family: 'helveticaneueregular', sans-serif !important;
}
:-moz-placeholder { /* Firefox 18- */
      font-family: 'helveticaneueregular', sans-serif !important;
}
	<input style="font-family: 'helveticaneueregular', sans-serif !important;" type="text" id="username" name="username" role="textbox" class="rememberMainField txt15 commonFont1Style2 clearTextField" placeholder="User ID" required="" autocapitalize="off" autocomplete="off" autocorrect="off" aria-label="Enter Your User ID" maxlength="50" minlength="3" pattern="^[^ ]+$" relinputid="RelativeClass0">

1 个答案:

答案 0 :(得分:1)

更多信息?在此示例中,两者均适用:

.font1::-webkit-input-placeholder {
    font-family: "Times New Roman", Times, serif;
    background-color: yellow;
}

.font2::-webkit-input-placeholder { 
    font-family: Arial, Helvetica, sans-serif;
    background-color: pink;
}
Times New Roman placeholder font:<br/>
<input class="font1" placeholder="User ID">
<input class="font1" type="password" placeholder="Password">
<br/><br/>
Arial placeholder font:<br/>
<input class="font2" placeholder="User ID" >
<input class="font2" type="password" placeholder="Password">