/    Sign up×
Community /Pin to ProfileBookmark

Changing style for input elements

Copy linkTweet thisAlerts:
Oct 30.2006

Please excuse my ignorance 😮 ,
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

to post a comment
CSS

7 Comments(s) ↴

Copy linkTweet thisAlerts:
@abzOct 30.2006 — [code=html]<style type="text/css">
<!--

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

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

-->
</style>
[/code]


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.
Copy linkTweet thisAlerts:
@Ben_HauthorOct 30.2006 — thanks abz
Copy linkTweet thisAlerts:
@Ben_HauthorOct 31.2006 — 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 ?
Copy linkTweet thisAlerts:
@abzOct 31.2006 — 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
Copy linkTweet thisAlerts:
@Ben_HauthorOct 31.2006 — 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

[CODE]<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>[/CODE]
Copy linkTweet thisAlerts:
@_Aerospace_Eng_Oct 31.2006 — 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
Copy linkTweet thisAlerts:
@Ben_HauthorNov 01.2006 — Thanks Aerospace

I thought I was going mad.

and thanks for the link, very interesting.

Ben
×

Success!

Help @Ben_H spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...