473,241 Members | 1,557 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,241 software developers and data experts.

How to change color of <select>?

Hello all,

I need to change the colour of my text. For the paragraph I do
document.fgColor ="blue" ;
but how do I do this for the select tags?
....and I prefer it to apply to all select tags
Tia.
Sep 27 '08 #1
4 6056
SAM
Le 9/27/08 2:24 AM, html a écrit :
Hello all,

I need to change the colour of my text. For the paragraph I do
document.fgColor ="blue" ;
prefer
JS :
document.getElementById('P_1').style.background = 'skyblue';
HTML :
<p id="P_1"blah </p>

but how do I do this for the select tags?
<select style="background: orange">
<option>100
<option>200
<option style="background: yellow">300
<option>400
</select>
...and I prefer it to apply to all select tags
<style type="text/css">
select { background: yellow; border: 2px solid orange; }
option { background: #ffc }
p { background: #ddd; }
#P_1 { background: azure; color: blue; text-align: justify }
</style>
<p>
<select>
<option>100
<option>200
<option style="background: yellow">300
<option>400
</select>
</p>
<p id="P_1"re blah </p>

<http://www.w3.org/TR/CSS21/indexlist.html>

--
sm
Sep 27 '08 #2
Hello all,

I need to change the colour of my text. For the paragraph I do
document.fgColor ="blue" ;

prefer
JS :
document.getElementById('P_1').style.background = 'skyblue';
HTML :
<p id="P_1"blah </p>

but how do I do this for the select tags?

<select style="background: orange">
<option>100
<option>200
<option style="background: yellow">300
<option>400
</select>
...and I prefer it to apply to all select tags

<style type="text/css">
select { background: yellow; border: 2px solid orange; }
option { background: #ffc }
p { background: #ddd; }
#P_1 { background: azure; color: blue; text-align: justify }
</style>
<p>
<select>
<option>100
<option>200
<option style="background: yellow">300
<option>400
</select>
</p>
<p id="P_1"re blah </p>

<http://www.w3.org/TR/CSS21/indexlist.html>
Thank you, what I need is a little different.

First of all, it is interesting that document.fgcolor propagates into
paragraphs but not into select elements, any idea why?

Second, I want to be able to change the colour of the select
tags as a response to a click on a button, so how do I assign
to all select tags a colour in script (as opposed to in style sheet/tag)?
Tia
Sep 27 '08 #3
html wrote:
>>Hello all,

I need to change the colour of my text. For the paragraph I do
document.fgColor ="blue" ;
prefer
JS :
document.getElementById('P_1').style.background = 'skyblue';
HTML :
<p id="P_1"blah </p>

>>but how do I do this for the select tags?
<select style="background: orange">
<option>100
<option>200
<option style="background: yellow">300
<option>400
</select>
>>...and I prefer it to apply to all select tags
<style type="text/css">
select { background: yellow; border: 2px solid orange; }
option { background: #ffc }
p { background: #ddd; }
#P_1 { background: azure; color: blue; text-align: justify }
</style>
<p>
<select>
<option>100
<option>200
<option style="background: yellow">300
<option>400
</select>
</p>
<p id="P_1"re blah </p>

<http://www.w3.org/TR/CSS21/indexlist.html>

Thank you, what I need is a little different.

First of all, it is interesting that document.fgcolor propagates into
paragraphs but not into select elements, any idea why?
It does not do that.

It only looks like it does that. Default background color is transparent.
Second, I want to be able to change the colour of the select
tags as a response to a click on a button, so how do I assign
to all select tags a colour in script (as opposed to in style sheet/tag)?
Change a class selector in an element above them. For example, add a
class "detonate" to body.

<style type="text/css">
..detonated select {
background: chartreuse;
}
</style>

using:

<button onclick="document.body.className='detonated'">deto nate</button>
Garrett
Tia

Sep 27 '08 #4
html wrote:
>>Hello all,

I need to change the colour of my text. For the paragraph I do
document.fgColor ="blue" ;
prefer
JS :
document.getElementById('P_1').style.background = 'skyblue';
HTML :
<p id="P_1"blah </p>

>>but how do I do this for the select tags?
<select style="background: orange">
<option>100
<option>200
<option style="background: yellow">300
<option>400
</select>
>>...and I prefer it to apply to all select tags
<style type="text/css">
select { background: yellow; border: 2px solid orange; }
option { background: #ffc }
p { background: #ddd; }
#P_1 { background: azure; color: blue; text-align: justify }
</style>
<p>
<select>
<option>100
<option>200
<option style="background: yellow">300
<option>400
</select>
</p>
<p id="P_1"re blah </p>

<http://www.w3.org/TR/CSS21/indexlist.html>

Thank you, what I need is a little different.

First of all, it is interesting that document.fgcolor propagates into
paragraphs but not into select elements, any idea why?
It does not do that.

It only looks like it does that. Default background color is transparent.
Second, I want to be able to change the colour of the select
tags as a response to a click on a button, so how do I assign
to all select tags a colour in script (as opposed to in style sheet/tag)?
Change a class selector in an element above them. For example, add a
class "detonate" to body.

<style type="text/css">
..detonated select {
background: chartreuse;
}
</style>

using:

<button onclick="document.body.className='detonated'">deto nate</button>
Garrett
Tia

Sep 27 '08 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
by: Ang Talunin | last post by:
Hey, I wondering if it's possible to retrieve all the <option>-fields from a <select> when posting a <form> to a php file Example: I've got a form like this: <form action = phpfile.php...
6
by: Bonge Boo! | last post by:
This has got to be obvious, but I can't make it work. I have a form called with 3 pull down menus. They are linked to a database which generates the values for the <SELECT? Pull-downs. Lets...
4
by: joiv | last post by:
I'm making a <select></select> with lots of <option></option>. It contains all possible options. Because of the length of the list, I also have an <input type="text">. This is what I wish to do:...
5
by: Brian Foley | last post by:
Hello, I am used to using the label tag with check boxes and radio buttons in html forms. This allows me to click on the text of the label to activate/deactivate the check box / button, rather...
14
by: xxbmichae1 | last post by:
I have a <select> object that i've set up an onchange event that fires in IE fine when I use the cursor up and down in the list, but If I use the cursor up and down in Firefox the event doesn't...
6
by: Chris Fink | last post by:
Does anyone know it is possible to include a small image(.gif .jpeg) within a <SELECT><option> so that the user would see the option text as well as a little image(icon) in the option? I know this...
4
by: luftikus143 | last post by:
Hi there, I have a nasty little problem, as so often, only with IE. Here is an screenshot to better illustrate the problem. http://geodata.grid.unep.ch/screenshot13.png The map is clickable (to...
4
by: Man-wai Chang | last post by:
-- iTech Consulting Co., Ltd. Expert of ePOS solutions Website: http://www.itech.com.hk (IE only) Tel: (852)2325 3883 Fax: (852)2325 8288
14
mikek12004
by: mikek12004 | last post by:
In a form I have 5 elements (e.g. pictures) and I wish for the user to be able to set the order of appearance. For this I have for each picture a select box (names select1 to select5) with "please...
0
by: abbasky | last post by:
### Vandf component communication method one: data sharing ​ Vandf components can achieve data exchange through data sharing, state sharing, events, and other methods. Vandf's data exchange method...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 7 Feb 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:30 (7.30PM). In this month's session, the creator of the excellent VBE...
0
by: fareedcanada | last post by:
Hello I am trying to split number on their count. suppose i have 121314151617 (12cnt) then number should be split like 12,13,14,15,16,17 and if 11314151617 (11cnt) then should be split like...
0
Git
by: egorbl4 | last post by:
Скачал я git, хотел начать настройку, а там вылезло вот это Что это? Что мне с этим делать? ...
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: Aftab Ahmad | last post by:
Hello Experts! I have written a code in MS Access for a cmd called "WhatsApp Message" to open WhatsApp using that very code but the problem is that it gives a popup message everytime I clicked on...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.