子列表项在悬停时未显示

Question

我的问题是第3级菜单没有出现在网站上。 - FISMA和HiPAA没有出现在我的菜单上。它们应该在服务

下的审计和评估之下

＆＃13;

＆＃13;

/* start h_menu */

.h_menu4 {
  float: center;
}
.toggleMenu {
  display: none;
  background: rgba(29, 82, 99, 0.22);
  padding: 10px 15px;
  width: 100%;
  color: #fff;
}
.nav {
  list-style: none;
  *zoom: 1;
}
.nav:before,
.nav:after {
  content: " ";
  display: table;
}
.nav:after {
  clear: both;
}
.nav ul {
  list-style: none;
  width: 9em;
}
.nav li a {
  display: block;
  padding: 10px 20px 40px 20px;
  color: #fff;
  font-size: 1em;
}
.nav li {
  position: relative;
}
.nav li.active a,
.nav li a:hover {
  border-bottom: 10px solid #23aae1;
}
.nav > li {
  float: left;
}
.nav > li > a.parent {
  background: url(../images/plus.png) no-repeat right top 16px;
}
.nav > li > a:hover {
  color: #23aae1;
}
.nav li ul {
  position: absolute;
  left: -9999px;
}
.nav > li.hover > ul {
  left: 0px;
}
.nav li li.hover ul {
  left: 100%;
  top: 0;
  -webkit-transition: background .2s linear;
  -moz-transition: background .2s linear;
  -ms-transition: background .2s linear;
  -o-transition: background .2s linear;
  transition: background .2s linear;
}
.nav li li a {
  font-size: 0.8725em;
  padding: 10px;
  display: block;
  color: #fff;
  background: rgba(73, 93, 137, 0.56);
  position: relative;
  z-index: 9999;
  border-top: 1px solid rgba(233, 233, 233, 0.09);
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.nav li li li a {
  background: #0a2334;
  z-index: 200;
  border-top: 1px solid #1d7a62;
}
.nav li li a:hover {
  background: #041420;
  color: #fff;
  border-bottom: none;
}

＆＃13;

<ul class="nav">
  <li><a href="about.html">About Us</a>
  </li>
  <li><a href="solutions.html">Solutions</a>
    <ul>
      <li><a href="HealthcareITS.html">Healthcare IT Solutions</a>
      </li>
      <li><a href="GovernmenITS.html">Government IT Solutions</a>
      </li>
    </ul>
  </li>
  <li><a href="services.html">Services</a>
    <ul>
      <li><a href="services1.html">Risk Management</a>
      </li>
      <ul>
        <li><a href="crsca.html">Cyber Risk & Security Controls Assessment</a>
        </li>
        <li><a href="csa.html">CyberSprint Advisory</a>
        </li>
      </ul>
      <li><a href="services2.html">Audit & Assessment</a>
      </li>
      <ul>
        <li><a href="fisma.html">FISMA</a>
        </li>
        <li><a href="hipaa.html">HIPAA</a>
        </li>
      </ul>
      <li><a href="services3.html">Disaster Recovery & Business Continuity Planning</a>
      </li>
    </ul>
  </li>
  <li><a href="contact.html">Contact</a>
  </li>
</ul>

＆＃13;

＆＃13;

＆＃13;

抱歉，我在这方面很陌生，并没有真正用于深度编码。每一个帮助都将非常感激。

Answer 1

问题是<li><a href="services1.html">Risk Management</a></li>必须包含子菜单<ul> ... </ul>。

＆＃13;

＆＃13;

/* start h_menu */

.h_menu4 {
  float: center;
}
.toggleMenu {
  display: none;
  background: rgba(29, 82, 99, 0.22);
  padding: 10px 15px;
  width: 100%;
  color: #fff;
}
.nav {
  list-style: none;
  *zoom: 1;
}
.nav:before,
.nav:after {
  content: " ";
  display: table;
}
.nav:after {
  clear: both;
}
.nav ul {
  list-style: none;
  width: 9em;
  padding: 0;
}
.nav li a {
  display: block;
  padding: 10px 20px 40px 20px;
  color: #000000;
  font-size: 1em;
}
.nav li {
  position: relative;
}
.nav li.active a,
.nav > li:hover > a {
  border-bottom: 10px solid #23aae1;
}
.nav > li {
  float: left;
}
.nav > li > a.parent {
  background: url(../images/plus.png) no-repeat right top 16px;
}
.nav > li:hover > a {
  color: #23aae1;
}
.nav li ul {
  position: absolute;
  left: -9999px;
}
.nav > li:hover > ul {
  left: 0px;
}
.nav li li:hover ul {
  left: 100%;
  top: 0;
  -webkit-transition: background .2s linear;
  -moz-transition: background .2s linear;
  -ms-transition: background .2s linear;
  -o-transition: background .2s linear;
  transition: background .2s linear;
}
.nav li li a {
  font-size: 0.8725em;
  padding: 10px;
  display: block;
  color: #fff;
  background: rgba(73, 93, 137, 0.56);
  position: relative;
  z-index: 9999;
  border-top: 1px solid rgba(233, 233, 233, 0.09);
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.nav li li li a {
  background: #0a2334;
  z-index: 200;
  border-top: 1px solid #1d7a62;
}
.nav li li a:hover {
  background: #041420;
  color: #fff;
  border-bottom: none;
}

＆＃13;

<ul class="nav">
  <li><a href="about.html">About Us</a>
  </li>
  <li><a href="solutions.html">Solutions</a>
    <ul>
      <li><a href="HealthcareITS.html">Healthcare IT Solutions</a>
      </li>
      <li><a href="GovernmenITS.html">Government IT Solutions</a>
      </li>
    </ul>
  </li>
  <li><a href="services.html">Services</a>
    <ul>
      <li><a href="services1.html">Risk Management</a>

        <ul>
          <li><a href="crsca.html">Cyber Risk & Security Controls Assessment</a>
          </li>
          <li><a href="csa.html">CyberSprint Advisory</a>
          </li>
        </ul>
      </li>
      <li><a href="services2.html">Audit & Assessment</a>
      </li>
      <ul>
        <li><a href="fisma.html">FISMA</a>
        </li>
        <li><a href="hipaa.html">HIPAA</a>
        </li>
      </ul>
      <li><a href="services3.html">Disaster Recovery & Business Continuity Planning</a>
      </li>
    </ul>
  </li>
  <li><a href="contact.html">Contact</a>
  </li>
</ul>

＆＃13;

＆＃13;

＆＃13;