0

I have a simple input field that looks like:

<input class="input" id="name" type="text" name="name" value="* Your Name" onfocus="if (this.value == '* Your Name') {this.value = '';}" onblur="if (this.value == '') {this.value = '* Your Name';}">

I would like to have the * Your Name in two colours. Something like:

<style>
.input {color: black}
.input span {color: red}
</style>

<input class="input" value="<span>*</span> Your Name">

Clearly the above code won't work. But I am just wondering what the best approach would be to solve this dilemma. I genuinely don't even know if it's possible.

Brandrally
  • 803
  • 3
  • 14
  • 24
  • look at this, was also asking about this, and this is what i got , https://stackoverflow.com/questions/37393323/change-a-part-of-the-text-placeholders-color – Ylama Mar 29 '18 at 14:18
  • this can point you some direction: https://stackoverflow.com/questions/37211597/html-labelafter-content-needs-to-have-different-colors-in-the-text – Ricardo Pontual Mar 29 '18 at 14:18
  • Possible duplicate of [Change a part of the text placeholders color](https://stackoverflow.com/questions/37393323/change-a-part-of-the-text-placeholders-color) – ecg8 Mar 29 '18 at 14:48

0 Answers0