CSS Change the font color of a text box

I searched and searched, but could not understand it correctly. I have a text box on my site, and in my CSS / HTML I defined its class, like everything else, and gave it a background image without any problems. I decided that I needed to change the font color, but no matter what I do, it just doesn't work. My CSS text box:

.tb1 { background-color : #505050; background-image: url(images/mb_btn2.jpg); color: 0090ff; border-style: none; onfocus="this.value='' } 

... this does not seem to work.

I read another answer to a similar question that was pointed out using

 onfocus="this.value='' 

which did nothing, then I tried, placeholder:

 <input name="username" type="text" class="tb1" maxlength="24" placeholder="Username"/> 

and this kind of work. It places the blue "Username" in the text box. but I have to remove it in order to start printing, And when you print, it still comes out in black, not a specific color.

This is an HTML form:

 <div id="login" class="login"><center> <form action="login.php" method="post"> Username:<br><input name="username" type="text" class="tb1" placeholder="Username"<br/> Password:<br><input class ="tb1" type="password" name="password" placeholder="Password"/><br /> <input class="tb1" type="submit" name="login" value="Login"/> </form></center> </div> 

So what will change the color of my text box? and / or clear it when you click on it so that the "Username" or "Password" is cleared, and you can enter your information without deleting it yourself before entering? ... oh and the submit button too

  • thanks
+7
html css text textbox
source share
4 answers

Fiddle

You missed # : color: #0090ff;

+6
source share
 <div id="login" class="login"> <form action="login.php" method="post">Username: <br> <input name="username" type="text" class="tb1" placeholder="Username"/> <br/>Password: <br> <input class="tb1" type="password" name="password" placeholder="Password" /> <br /> <input class="tb1" type="submit" name="login" value="Login" /> </form> </div> 

CSS

 .login { width:250px; margin:0px auto; } .tb1 { background-color : #505050; background-image: url(images/mb_btn2.jpg); color: #0090ff; border-style: none; } 

fiddle

enter image description here

in your code that you used <center> , do not use it, it is deprecated.

Rip off

+2
source share

Your color color ad # missing. Change it to color: #0090ff;

+1
source share

Try

I assume that you want to change the font color when the user focus is in the TextBox.

 .tb1 { background-color : #505050; background-image: url(images/mb_btn2.jpg); color: RED; border-style: none; } .tb1:focus { background-color : #505050; background-image: url(images/mb_btn2.jpg); color: YELLOW; border-style: none; } 
0
source share

All Articles