Change Color For One Part Of Placeholder

How can I change just one part of placeholder? Here is my html:

Solution 1:

You can do it like this:

<inputtype="email" placeholder="Retype email:"id="email">


#email {
   width: 95%;
   border: 1px solid black;
   font-size: 1.15em;
}

#email::-webkit-input-placeholder:after {
   content:"*";
   color:red;
   font-size:1.15em;
}

#email::-moz-placeholder:after {
     content:"*";
     color:red;
     font-size:1.15em;
 }
 #email:-ms-input-placeholder:after {     
     content:"*";
     color:red;
     font-size:1.15em;
}

Check the snippet below:

#email {
  width: 95%;
  border: 1px solid black;
  font-size: 1.15em;
}
#email::-webkit-input-placeholder:after {
  content: "*";
  color: red;
  font-size: 1.15em;
}
#email::-moz-placeholder:after {
  content: "*";
  color: red;
  font-size: 1.15em;
}

<inputtype="email"placeholder="Retype email:"id="email">

Share