修改input placeholder样式

Posted ximi007

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了修改input placeholder样式相关的知识，希望对你有一定的参考价值。

<style>
/* 通用 */
::-webkit-input-placeholder {
    color: rgb(235, 126, 107);
}
::-moz-placeholder {
    color: rgb(235, 126, 107);
}

/* firefox 19+ */
:-ms-input-placeholder {
    color: rgb(235, 126, 107);
}

/* ie */
input:-moz-placeholder {
    color: rgb(235, 126, 107);
}

/* webkit专用 */
#field2::-webkit-input-placeholder {
    color: rgb(235, 126, 107);
}
#field3::-webkit-input-placeholder {
    color: rgb(235, 126, 107);
}
#field4::-webkit-input-placeholder {
    color: rgb(235, 126, 107);
}

/* mozilla专用 */
#field2::-moz-placeholder {
    color: rgb(235, 126, 107);
}
#field3::-moz-placeholder {
    color: rgb(235, 126, 107);
}
#field4::-moz-placeholder {
    color: rgb(235, 126, 107);
}
</style>

chrome下测试效果图：

 参考：html5中input背景提示文字(placeholder)的CSS美化

以上是关于修改input placeholder样式的主要内容，如果未能解决你的问题，请参考以下文章

input框中修改placeholder的样式

修改input placeholder样式

修改 Input placeholder 的样式

如何修改placeholder的颜色

表单之input的样式修改

修改 input中的placeholder的字体样式和颜色