开发者

Change child text color different from parent text color?

开发者 https://www.devze.com 2022-12-09 19:44 出处:网络
I have a navbar that drops down.The parent text is black, when you hover over the parent text it drops down and shows other categories.The text for the categories is also white, is it possible to chan

I have a navbar that drops down. The parent text is black, when you hover over the parent text it drops down and shows other categories. The text for the categories is also white, is it possible to change the text color in the drop dow开发者_开发百科n category text to say white?

The link class looks like this:

a:link {
    color: #000;
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}

and the navbar code looks like this:

#nav1 {
    /*sets up nav bar*/
    background: url(images/nav1-sep.gif) no-repeat left top;
    font-size: 13px; /*for navbar, code, design..*/
    height: 33px;
}
#nav1 ul.sf-menu li {
    /*separates nav cats*/
    position: relative;
    background: url(images/nav1-sep.gif) no-repeat right top;
    float: left;
    line-height: 37px; /*hover box height*/
    padding: 0 1px 0 0;
    text-align: center;
}
#nav1 ul.sf-menu li {
    /*spaces cats evenly*/
    /*color:#000;text color*/
    display:block ;
    position: relative;
    float: left;
    text-decoration:none;
    width: 127px; /*width of code, design.. placement*/
    cursor: pointer;
}
#nav1 ul.sf-menu li a:hover {
    /*on nav top hover*/
    /*change background color on hover*/
    text-decoration: none;
    background: #FEFEFE;
}

#nav1 ul.sf-menu li ul.children {
    /*drop down semi trans*/
    border: 2px solid #ffffff;
    background: url(images/BG_semi_trans.png) repeat-y top left;
}
#nav1 ul.sf-menu li ul.children li a:hover {
    text-decoration:none;
    filter:alpha(opacity=35);-moz-opacity:.35;opacity:.35;
    /*background:#000000;*/
}

#nav1 ul.sf-menu li ul.children
{
    /*aligns drop down with navbar*/
    margin:5px 0 0 0;
}
#nav1 ul.sf-menu li ul.children ul.children
{
    margin:-1px 0 0 27px;
}

thanks for any help!


You'll need to use an "a, a:link, a:visited" selector on your children. So something like,

#nav1 ul.sf-menu li ul.children a,
#nav1 ul.sf-menu li ul.children a:link,
#nav1 ul.sf-menu li ul.children a:visited {
     color: white;
}
0

精彩评论

暂无评论...
验证码 换一张
取 消