html - Superfish - 在 .active hover parents 上保留 css 设置

Question

我试图在菜单的所有级别上保持相同的设置(背景颜色:#457BB7)，就像这个打印品一样:

http://img838.imageshack.us/img838/7943/ex1fn.jpg

问题是当我向它添加“事件”类时，仅当鼠标悬停在当前元素上时(例如:“网络安全”突出显示但“Segurança”和“Produtos”保持正常)，就像这样图片:

http://img9.imageshack.us/img9/4486/ex2l.jpg

我用“a”、“li”和“ul”尝试了很多不同的东西，但结果变化不大。

这是菜单的代码(不是全部):

<ul class="Menu">
           <li> <a href="#" style="cursor:default">Soluções</a>
                <ul>
                  <li><a href="seguranca.htm">Segurança</a></li>
                  <li><a href="monit_integ.htm">Monitorização Integrada</a></li>
                  <li><a href="alta_disp.htm">Alta Disponibilidade</a></li>
                  <li><a href="gest_patr.htm">Gestão de Património</a></li>
                  <li><a href="spool.htm">Tratamento de Spool</li>
                </ul>
            </li>
          <li class="active"><a href="#" style="cursor:default">Produtos</a>
                <ul>
                  <li><a href="#" style="cursor:default">Segurança iSeries</a>
                      <ul>
                        <li><a href="net_secur.htm">Network Security</a></li>
                        <li><a href="atrty_broker.htm">Autohority Broker</a></li>
                      </ul>
                  </li> ...

CSS 是这样的:

.Menu    { margin:0; padding:0; padding-bottom:0; width:700px;}
.Menu ul { margin:0; padding:0; }
.Menu li { float:left; width:150px; list-style:none; position:relative; z-index:999; height:26px; }
.Menu a  { display:block; padding-left:2px; padding-top:2px; color:#FFFFFF; text-decoration:none; vertical-align:middle; overflow:hidden; }

.Menu li ul                                        { top:-999em; position:absolute; text-align:left; }
.Menu li:hover li ul, .Menu li.sfHover li ul       { top:-999em; vertical-align:middle; text-align:left; }
.Menu li li:hover li ul, .Menu li li.sfHover li ul { top:-999em; vertical-align:middle; text-align:left; }

.Menu li:hover ul, ul.Menu li.sfHover ul             { left:0px;  top:26px; font-size:13px; text-align:left;}
.Menu li li:hover ul, ul.Menu li li.sfHover ul       { left:200px; top:2px; font-size:13px; text-align:left;}
.Menu li li li:hover ul, ul.Menu li li li.sfHover ul { left:0px; top:26px; text-align:left;}

.Menu a:hover       { color:#FFFFFF; font-weight:bold;  }
.Menu li:hover      { background-color:#457BB7; color:#FFFFFF; }
.Menu li.sfHover    { background-color:#457BB7; color:#FFFFFF; }

/* superfish */
.superfish li:hover ul, .superfish li li:hover ul, .superfish li li li:hover ul { top: -999em; vertical-align:middle; }

.Menu li            { background-color:#235995; width:100px; height:26px; text-align:center; }
.Menu li li         { background-color:#235995; width:200px; height:18px; float:none;  text-align:left;}
.Menu li li li      { background-color:#235995; width:180px; height:18px; float:none;  text-align:left;}

.Menu li.active         { background-color:#346AA6; width:100px; height:24px; text-align:center; }
.Menu li.active a       { background-color:#346AA6; width:100px; height:24px; text-align:center; }
.Menu li.active li a    { background-color:#235995; width:200px; height:18px; float:none; text-align:left;}
.Menu li.active li li a { background-color:#235995; width:180px; height:18px; float:none; text-align:left;}

.Menu li.active li a:hover { background-color:#457BB7; }
.Menu li.active a:hover { background-color:#457BB7; }

我确定缺少一些愚蠢的东西，但是你们能帮我解决这个问题吗？

Answer 1

下面的代码适用于 css、styes

<ul class="Menu">
   <li> <a href="#" style="cursor:default">Soluções</a>
        <ul>
          <li><a href="seguranca.htm">Segurança</a></li>
          <li><a href="monit_integ.htm">Monitorização Integrada</a></li>
          <li><a href="alta_disp.htm">Alta Disponibilidade</a>
            <ul>
                <li><a href="monit_integ.htm">lorem ipsum</a></li>
                <li><a href="alta_disp.htm">lorem ipsum</a>
            </ul>
          </li>
          <li><a href="gest_patr.htm">Gestão de Património</a></li>
          <li><a href="spool.htm">Tratamento de Spool</li>
        </ul>
    </li>