Change an HTML5 input's placeholder color with CSS

后端 未结 30 3188
猫巷女王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:52

    try this code for different input element different style

    your css selector::-webkit-input-placeholder { /*for webkit */
        color:#909090;
        opacity:1;
    }
     your css selector:-moz-placeholder { /*for mozilla */
        color:#909090;
        opacity:1;
    }
     your css selector:-ms-input-placeholder { /*for for internet exprolar */ 
       color:#909090;
       opacity:1;
    }
    

    example 1:

    input[type="text"]::-webkit-input-placeholder { /*for webkit */
        color: red;
        opacity:1;
    }
     input[type="text"]:-moz-placeholder { /*for mozilla */
        color: red;
        opacity:1;
    }
     input[type="text"]:-ms-input-placeholder { /*for for internet exprolar */ 
       color: red;
       opacity:1;
    }
    

    example 2:

    input[type="email"]::-webkit-input-placeholder { /*for webkit */
        color: gray;
        opacity:1;
    }
     input[type="email"]:-moz-placeholder { /*for mozilla */
        color: gray;
        opacity:1;
    }
     input[type="email"]:-ms-input-placeholder { /*for for internet exprolar */ 
       color: gray;
       }
    

提交回复
热议问题