placeholder文字显示位置及显示颜色

 

1）placeholder文字显示文本位置可以使用(即placeholder文字距离左侧的距离)

　　

text-indent: 5px;

　进行缩进，

　如果需要水平显示，可以直接使用

text-align:center;

　　

2）placeholder文字显示文颜色可以使用,

                            :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
                                color: #000;
                                font-size: 14px;
                                opacity:1; 
                            }

                            ::-moz-placeholder { /* Mozilla Firefox 19+ */
                                color: #000;
                                font-size: 14px;
                                opacity:1;
                            }

                            input:-ms-input-placeholder{
                                color: #000;
                                font-size: 14px;
                                opacity:1;
                            }

                            input::-webkit-input-placeholder{
                                color: #000;
                                font-size: 14px;
                                opacity:1;
                            }

3）*****  placeholder文字位于input文本框的竖直方向的居中位置，需要给input加上高度height，及line-height。

Demo：

代码如下：

<input type='text' class='evaluate-input' placeholder='未评分'></span>/6

　　　　　　　　　　　　　　　　.evaluate-input{
                                margin-left:20px;
                                line-height:30px;
                                width:60px;
                                background-color:#f2f2f2;
                                height:30px;
                                border:none;
                                border-radius:5px;
                                // text-indent: 5px;
                                text-align:center;
                            }

                            :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
                                color: #000;
                                font-size: 14px;
                                opacity:1; 
                            }

                            ::-moz-placeholder { /* Mozilla Firefox 19+ */
                                color: #000;
                                font-size: 14px;
                                opacity:1;
                            }

                            input:-ms-input-placeholder{
                                color: #000;
                                font-size: 14px;
                                opacity:1;
                            }

                            input::-webkit-input-placeholder{
                                color: #000;
                                font-size: 14px;
                                opacity:1;
                            }