Change an HTML5 input's placeholder color with CSS

后端 未结 30 3165
猫巷女王i
猫巷女王i 2020-11-21 04:36

Chrome supports the placeholder attribute on input[type=text] elements (others probably do too).

But the following CSS doesn\'t do anything

30条回答
  •  醉酒成梦
    2020-11-21 04:41

    I just realize something for Mozilla Firefox 19+ that the browser gives an opacity value for the placeholder, so the color will not be what you really want.

    input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
        color: #eee; opacity:1;
    }
    input:-moz-placeholder, textarea:-moz-placeholder {
        color: #eee; opacity:1;
    }
    input::-moz-placeholder, textarea::-moz-placeholder {
        color: #eee; opacity:1;
    }
    input:-ms-input-placeholder, textarea:-ms-input-placeholder {
        color: #eee; opacity:1;
    }
    

    I overwrite the opacity for 1, so it will be good to go.

提交回复
热议问题