【CSS】修改input中默认placeholder的样式

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_33237207/article/details/88814397

默认的placeholder字体颜色是呈浅灰色，如果想改变这个默认颜色，解决方案如下：

<input type='text' placeholder='请留下您的联系方式' class='input-phone'/>

            ::-webkit-input-placeholder {
                /* Chrome/Opera/Safari */
                color: #999;
            }

            ::-moz-placeholder {
                /* Firefox 19+ */
                color: #999;
            }

            :-ms-input-placeholder {
                /* IE 10+ */
                color: #999;
            }

            :-moz-placeholder {
                /* Firefox 18- */
                color: #999;
            }

注：冒号前可写input或textarea元素或选择器名称等，例如：

            .input-phone {
                color: red;
            }

            .input-phone::-webkit-input-placeholder {
                /* Chrome/Opera/Safari */
                color: #999;
            }

            .input-phone::-moz-placeholder {
                /* Firefox 19+ */
                color: #999;
            }

            .input-phone:-ms-input-placeholder {
                /* IE 10+ */
                color: #999;
            }

            .input-phone:-moz-placeholder {
                /* Firefox 18- */
                color: #999;
            }

利用此方法还可更改placeholder的其他样式，快去试试吧~