Could it be possible to make css selector affect o

问题:

This question already has an answer here:

• How to affect other elements when a div is hovered 6 answers

For example, I want to make two textboxes have the same style when either is focused:

<div class="divTxt">
    <input type="text" id="a" class="a" />
    <input type="text" id="b" class="b" />
</div>

and the css would be:

.a:focus 
{
    background-color:Blue;
}
.b:focus 
{
    background-color:Yellow;
}

What I need is make a's background-color:Yellow when b is focused and vice versa. any possibilities? Thanks a lot.

回答1:

You could try the General Sibling Selector(~) if the input boxes are next to each other.

Something like:

.a:focus {    background-color:Blue;}
.a:focus~.b {    background-color:Blue;}
.b:focus {    background-color:Yellow;}
.b:focus~.a {    background-color:Yellow;}

Note: Completely untested and a stab in the dark at best!

回答2:

If they've got javascript disabled, they probably won't notice text box styles.

回答3:

.chk1:focus{
   background-color:Blue;
}
.chk2:focus{
   background-color:Yellow;
}

text feilds

<input class=chk1 type=text id="a">
<input class=chk2 type=text id="b">

This one will work fine with FireFox but might have issues with IE6 See CSS Issue Focus For IE6

If you want this to work with IE, you might want to use javascript!!

Hope this helps

RDJ