Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS Change textbox font color

I've searched and searched but can't quite get this right. I have a text box on my site and in my CSS/HTML I defined it a class much like anything else and gave it a background image no problem. I decided I needed to change the font color but no matter what I do, it just doesn't work.

My text box CSS is:

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

...this doesnt seem to quite work.

I read someone else's response to a similar question that stated using

onfocus="this.value=''

which didn't do anything, I then tried, a placeholder:

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

and this sort of worked. It put a blue "Username" in the textbox. but I then have to erase it to begin typing, AND when you type it still comes out black and not in the defined color.

This is the form HTML:

<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 would work to change the color of my textbox? and/or clear it out when you click on it so "Username" or "Password" is cleared and you can enter your information without having to erase it yourself prior to input?...oh and the submit button too

  • Thanks
like image 532
Vishera Avatar asked Feb 11 '14 03:02

Vishera


People also ask

How do you change the color of a textbox in CSS?

You can also use the RGB decimal equivalent or the color name. For example, if you change the textbox background color to say, blue, you could specify any one of the following: background-color:blue; , background-color:#0000FF; , background-color:rgb(0,0,255); .

Can you change font color in CSS?

Simply add the appropriate CSS selector and define the color property with the value you want. For example, say you want to change the color of all paragraphs on your site to navy. Then you'd add p {color: #000080; } to the head section of your HTML file.

What is the CSS code for text color?

Text-color property is used to set the color of the text. Text-color can be set by using the name “red”, hex value “#ff0000” or by its RGB value“rgb(255, 0, 0).


2 Answers

Fiddle

You missed # : color: #0090ff;

like image 82
JunM Avatar answered Oct 02 '22 09:10

JunM


<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 you have used <center> , dont use it, it has been deprecated.

Soruce

like image 44
Amarnath Balasubramanian Avatar answered Oct 02 '22 08:10

Amarnath Balasubramanian