انتخاب تگ مادر در css

N

navid3D_69

New Member
سلام من می خوام توی این منو وقتی که یکی از زیر منو ها فعال میشه رنگ منوی مادر اون منو هم رنگی بشه ولی نمیشه مثلا در منوی اصلی وقتی روی هر کدوم از زیر منو ها میره رنگ منو اصلی هم سبز بشه و وقتی روی زیر منو های منو جانبی میره رنگ رنگ خود منو جانبی قرمز بشه میشه لطفا اهنمایی کنید

[HTMLS]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />




<style type="text/css">
body {
font-family:Tahoma, Geneva, sans-serif;
font-size:12px;
direction:rtl;
}
a {
text-decoration:none;
color:#FFF;
}
a:hover {
color:#CCC;
}
#main-menu {
position:relative;
}
#main-menu a {
display:block;
width:150px;
padding:8px;
border:#666 solid 1px;
background-color:#030;
}
#main-menu a:hover {
background-color:#F00;
}
#main-menu ul {
list-style-type:none;
padding-top:0px;
}
#main-menu li {
float:right;
position:relative;
text-align:center;
}
#main-menu li ul a{
text-align:center;
border:0px;
border-bottom:#666 1px solid;
}
#main-menu ul.sub-menu {
display:none;
position:absolute;
top:30px;
margin-right:0px;
padding:0px;
z-index:999;
}
#main-menu ul.sub-menu li {
text-align:center;
}
#main-menu li:hover ul.sub-menu {
display: block;
border: 1px solid #666;
}
.clear{
clear:both;
}
#program {
background:#F00;

}
#programhover a:hover {
background-color: #7ac142
}
</style>


</head>
<body>
<div id="main-menu">
<ul>
<li id="programhover"><a href="#">منوی اصلی</a>
<ul id="program" class="sub-menu">
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
</ul>
</li>
<li><a href="#">منوی جانبی</a>
<ul id="menutwo" class="sub-menu">
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
<li><a href="#">منوی زیرمجموعه</a></li>
</ul>
</li>


</ul>
<div class="clear"></div>
</div>
<hr />
</body>
</html>

[/HTMLS]
 
Omid.P

Omid.P

New Member
داداش کد استایلت باید اینطوری شه :
HTML: 
<style type="text/css">
body {
    font-family:Tahoma, Geneva, sans-serif;
    font-size:12px;
    direction:rtl;
}
a {
    text-decoration:none;
    color:#FFF;
}
a:hover {
    color:#CCC;
}
#main-menu {
    position:relative;
}
#main-menu a {
    display:block;
    width:150px;
    padding:8px;
    border:#666 solid 1px;
    background-color:#030;        
}

#main-menu li:hover > a  {
	background-color:#F00
}
#main-menu ul {
    list-style-type:none;
    padding-top:0px;    
}
#main-menu li {
    float:right;
    position:relative;
    text-align:center;
}
#main-menu li ul a{
    text-align:center;
    border:0px;
    border-bottom:#666 1px solid;
}
#main-menu ul.sub-menu {
    display:none;
    position:absolute;
    top:30px;
    margin-right:0px;
    padding:0px;
    z-index:999;
}
#main-menu ul.sub-menu li {
    text-align:center;
}
#main-menu li:hover ul.sub-menu {
    display: block;
    border: 1px solid #666;
}
.clear{
    clear:both;
}
#program {
	background:#F00;
 
}
#main-menu li#programhover:hover > a ,#program li:hover a:hover {
	background-color:#7ac142
}

</style>
 
برای ارسال پاسخ شما باید وارد سیستم شوید.

آخرین مطالب مجیدآنلاین

جدیدترین ارسال ها

بالا