As you can see in the image there are some tabs called welcome, aa, bb etc. Now the tab color is blue for an image (tab.png) that I have provided but开发者_运维技巧 I want to set a different image or no image at the time of selected. Here Welecome is selected and I have provided an image (tab_selected.png) for selected condition but that image is not rendering. Or If I dont provide any image in selected state, still the tab.png is reflecting. What can I do for this ?
CSS:
#navigation a {
color:#FFFFFF;
display:block;
font:12px Arial, Helvetica, sans-serif;
margin:0 4px 0 0;
padding:3px 10px 4px;
text-decoration:none;
background-image:url(../images/tab.png);
}
#navigation .selected a {
background-image:url(../images/tab_selected.png);
border-bottom:1px solid #e0e0e0;
font-weight:bold;
color:#000;
padding-bottom:3px;
}
Which element are you applying the "selected" class to?
If it is the anchor element (a), then your CSS rule should be:
#navigation a.selected {
Added double quotes for urls. Try this...
Main issue was found by obfuskater
#navigation a {
color:#FFFFFF;
display:block;
font:12px Arial, Helvetica, sans-serif;
margin:0 4px 0 0;
padding:3px 10px 4px;
text-decoration:none;
background-image:url("../images/tab.png");
}
#navigation a.selected {
background-image:url("../images/tab_selected.png");
border-bottom:1px solid #e0e0e0;
font-weight:bold;
color:#000;
padding-bottom:3px;
}
精彩评论