css:webkit-input-placeholder背景色

时间:2014-11-07 15:45:42

标签: css background webkit placeholder

尝试设置占位符背景颜色。它工作正常,直到我尝试增加输入字段高度。在mozilla&即占位符背景填充输入内的所有空间。但是在webkit中,仅为占位符文本高度设置了背景。

以下是一个示例:http://jsfiddle.net/3zp36wL7/2/

::-webkit-input-placeholder { 
    color: red;
    background: yellow;
}

你会在FF&中看到黄色背景。 IE,但在Chrome或Safari中看起来很糟糕。

是否有通过CSS的解决方案?

1 个答案:

答案 0 :(得分:1)

您可以使用line-height代替height;

Fiddle

CSS

 ::-webkit-input-placeholder { 
    color: red;
    background: yellow;
 }
 :-moz-placeholder { 
   color: red;
   background: yellow;
 }
 ::-moz-placeholder { 
    color: red;
    background: yellow;
 }
 :-ms-input-placeholder { 
    color: red;
    background: yellow;
 }

 input {
    line-height: 50px;
 }