我知道IE6有一個問題:懸停可見性和子選擇器,但不明白爲什麼我的子菜單不下降?我已經包含代碼,並會很感激,如果有人能告訴我我的錯誤在哪裏?這是從之前收到的回覆收到的回覆。你會注意到我已經嘗試了htc文件的行爲,那對我也不適用。謝謝在IE6子菜單中沒有下降的菜單列表
<ul id="navigation" class="nav-main">
<li><a href="http://www.somedomain.com/">Home</a></li>
<li class="list"><a href="#">Freebies</a>
<ul class="nav-sub">
<li><a href="http://www.somedomain.com/category/backgrounds/">Backgrounds</a></li>
<li><a href="http://www.somedomain.com/category/buttons/">Buttons</a></li>
<li><a href="http://www.somedomain.com/category/graphics/">Graphics</a></li>
<li><a href="http://www.somedomain.com/category/html-css/">HTML & CSS</a></li>
<li><a href="http://www.somedomain.com/category/icons/">Icons</a></li>
<li><a href="http://www.somedomain.com/category/psd/">PSD</a></li>
<li><a href="http://www.somedomain.com/category/templates/">Templates</a></li>
<li><a href="http://www.somedomain.com/category/tutorials/">Tutorials</a></li>
</ul>
</li>
<li class="list"><a href="#">About</a>
<ul class="nav-sub">
<li><a href="http://www.somedomain.com/about/">AboutUs</a></li>
<li><a href="http://www.somedomain.com/commercial-use/">Commercial Use</a></li>
<li><a href="http://www.somedomain.com/about/terms-of-use/">Terms Of Use</a></li>
</ul>
</li>
<li><a href="http://www.somedomain.com/advertise/">Advertise</a></li>
<li><a href="http://www.somedomain.com/contact/">Contact</a></li>
</ul>
body {
behavior: url(csshover3.htc);
}
#navigation {
margin:0;
padding: 0;
clear:both;
width:999px;
height:51px;
background: #d6eaf8 url(../images/dropdown-bg.gif) repeat-x left top;
}
ul.nav-main,
ul.nav-main li {
list-style: none;
margin: 0;
padding: 0;
}
ul.nav-main {
position: relative;
z-index: 597;
}
ul.nav-main li:hover > ul {
visibility: visible;
}
ul.nav-main li.hover,
ul.nav-main li:hover {
position: relative;
z-index: 599;
cursor: pointer;
background: url(../images/dropdown-bg-hover.gif) repeat-x left top;
}
ul.nav-main li {
float:left;
display:inline-block ;
height: 100%;
color: #999;
font: 14px Tahoma, Verdana, Arial, Helvetica, sans-serif;
background: url(../images/separator.gif) no-repeat right center;
}
ul.nav-main li a {
display:inline-block;
padding: 16px 16px 0 16px;
height: 35px;
color: #fff;
font: 14px Tahoma, Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
}
ul.nav-main li a:hover {
color:#D6D6D6;
}
ul.nav-main *.list {
padding-right: 22px;
background: url(../images/navigation-arrow.gif) no-repeat right top;
}
ul.nav-sub {
display:block;
position: absolute;
padding:10px;
top: 48px;
left: 0;
z-index: 598;
background: #353535 url(../images/dropdown-list-bg.gif) repeat-x left top;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
border-left: 1px solid #000;
}
ul.nav-sub li {
list-style:none;
display:block;
padding: 0;
height: 27px;
float: none;
width:145px;
border-bottom: 1px solid #5a5a5a;
background: none;
}
ul.nav-sub li a {
list-style:none;
display:none;
padding: 6px 5px 6px 5px;
height: 15px;
float: none;
width:145px;
background: none;
font: 12px Tahoma, Verdana, Arial, Helvetica, sans-serif;
}
ul.nav-main li:hover ul.nav-sub { display:none; /* OR display:list-item */ }
你可以發佈一個[JSFiddle](http://jsfiddle.net/)與您的HTML和CSS?看到你的標記會容易得多。 –
@chris我用我的html更新了我的代碼。謝謝 – bollo