Click to See Complete Forum and Search --> : Changing style for input elements


Ben H
10-30-2006, 04:27 AM
Please excuse my ignorance :o ,
but how do you change style/appearance/colours for standard html input elements like checkboxes, text areas and so on.

Any pointers or examples gratefully received !

thanks in advance
Ben

abz
10-30-2006, 04:34 AM
<style type="text/css">
<!--

input{
background-color: #000000;
color: #FFFFFF;
}

select{
background-color: red;
color: blue;
}

-->
</style>



put that in your <head> and play around with values. The first bit selects what html tag you are going to style, and the bits in the {} determine what property to style and how you want it.

Look up CSS on google.

Ben H
10-30-2006, 04:52 AM
thanks abz

Ben H
10-31-2006, 02:32 AM
I'm still having a problem - I would like to change the background colour inside a checkbox and change the colour of the tick

Any ideas ?

abz
10-31-2006, 03:58 AM
that is what that bit of code I posted should do. I will look into it though for you. Could you post your code or a link to the page in question please

Ben H
10-31-2006, 04:08 AM
Hi abz

here is my code below - the textarea has a "nice" pink background inside but the checkbox only has a pink surround - whereas I would like to have the checkbox have pink inside (don't ask why !) and I would also like to change the colour of the checkbox tick.

thanks again
Ben

<html>
<head>
<style type="text/css">
<!--

input{
background-color: #ff00ff;
color: #FFFFFF;
}

select{
background-color: red;
color: blue;
}

-->
</style>
</head>
<body>

<input type=textarea>

<p>

<input type=checkbox>

</body>
</html>

_Aerospace_Eng_
10-31-2006, 10:58 AM
You can't change the background color of the checkbox. You can't change the checkbox check color either at least not with normal html.
Read this http://www.badboy.ro/articles/2005-07-23/index.php

Ben H
11-01-2006, 01:38 AM
Thanks Aerospace
I thought I was going mad.
and thanks for the link, very interesting.
Ben