All geek questions in one place

Value / Placeholder - different style for words

I have a problem with placeholders. I want to ask if it is possible to style the value in the input fields, but in the way to style the words with this value are different.

For example, if we have an input field that has an initial value of "First Name" I want to have green color for "First" and red color for "Name" (this is just an example).

Is it even possible?

Note: I use the value as a "placeholder" (instead of the html placeholder attribute) due to ie.

 <input type="text" value="First Name" onFocus="if (this.value == 'First Name') {this.value = '';}" onBlur="if (this.value == '') {this.value = 'First Name';}" />
+4
source share
2 answers

Unfortunately this is not possible. when it comes to styling form elements, there are many obstacles, the color can be set for the element, not the cleaning one, try the following:

http://jsfiddle.net/Fgd2e/1/

+3
source

You can change the input color using the style color attribute. Having separate colors for each word is much more complicated. You must have an overlay that displays the correct colors. In addition, the cursor will disappear, so the user will not know where he is now.

0
source

Source: https://habr.com/ru/post/1410842/

More articles:


All Articles