Change color of one character in a text box HTML/C

问题:

I'm designing a web site and i would like to ask you guys that, how can I change the color of just one character in a string in a text box of HTML by CSS?

example : STACK OVER FLOW just the 'A' letter is red!

Thanks guys

回答1:

You can't do this with a regular <input type="text"> or <textarea> element, but with a normal element (like <div> or <p>) made contenteditable, you have all the freedoms of html/css formatting.

<div contenteditable>
    ST<span style="color: red">A</span>CK OVERFLOW
</div>

http://jsfiddle.net/jVqDJ/

The browser support is very good as well (IE5.5+). Read more at https://developer.mozilla.org/en-US/docs/Web/HTML/Content_Editable

回答2:

The question is - what did you mean by "text box"? Did you mean simple text on a page, or editable text like input type="text" or textarea? If you meant simple text, then the previous answers will do the job. But in case of editable text, it is impossible to achieve by css.

回答3:

you could use bold tags A

css:

b {
font-color: red;
}

回答4:

From css you can only change an elements property so you need to insert the letter "A" in another element like this:

ST<span>A</span>CK OVER FLOW just the 'A' letter is red!

And the CSS part is

span{
   color:#FF0000;
}

Or attach a class to it like this

ST<span class="myRedA">A</span>CK OVER FLOW just the '<A' letter is red!

CSS:

span.myRedA{
       color:#FF0000;
    }

回答5:

<font color="#colors">text text text</font>