Question

我已经开始使用HTML CSS Bootstrap设计一个网站了，而制作导航菜单下拉菜单却没有将鼠标悬停在它下面我特此附上所需的代码

108.59.81.69

结果就像这个enter image description here

请帮助......

Answer 1

首先在你要制作下拉列表的li中添加“dropdwon”类。第二次在ul

上添加“dropdown-menu”类

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
        <nav>
          <ul class="nav navbar-nav mainNavigation">
            <li class="active"><a href="#">Home </a></li>
            <li><a href="#"> About Us </a></li>
            <li><a href="#"> Marketing Services </a></li>
            <li><a href="#"> IT Management Services </a></li>
            <li class="dropdown"><a href="#"> Molex Portfolio </a>
                <ul class="dropdown-menu">
                    <li><a href="#"> Fibre Products </a> </li>
                    <li><a href="#"> Copper Products </a> </li>
                </ul>
            </li>
            <li><a href="#">Contact Us </a></li>
            <li><a href="#"> Employment Opp </a></li>

          </ul>
          </nav>
        </div>

并添加此css

.dropdown:hover .dropdown-menu{ display:block; }

我的嵌套下拉菜单不会在设计网站时将鼠标悬停在导航栏中

1 个答案: