Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Changing Placeholder Color

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 188
    Comment on it

    WebKit, Blink (Safari, Google Chrome, Opera 15+) and Microsoft Edge are using a pseudo-element: ex- ::-webkit-input-placeholder.

    Mozilla Firefox 4 to 18 is using a pseudo-class: :-moz-placeholder (one colon). ex- :-moz-placeholder

    Mozilla Firefox 19+ is using a pseudo-element: ::-moz-placeholder, but the old selector will still work for a while. ex- ::-moz-placeholder

    Internet Explorer 10 and 11 are using a pseudo-class: :-ms-input-placeholder. ex- :-ms-input-placeholder

    Internet Explorer 9 and lower does not support the placeholder attribute.

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style>
    ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
        color:    #909;
    }
    :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
       color:    #909;
       opacity:  1;
    }
    ::-moz-placeholder { /* Mozilla Firefox 19+ */
       color:    #909;
       opacity:  1;
    }
    :-ms-input-placeholder { /* Internet Explorer 10-11 */
       color:    #909;
    }
    </style>
    </head>
    <body>
    
    <input placeholder="This is a placeholder">
    </body>
    </html>
    

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: