Html 悬停多级下拉菜单

我正在尝试创建一个下拉菜单，其中的子菜单将在鼠标悬停时打开，但子菜单始终显示在底部而不是其父菜单的右侧

 <li class="dropdown">
   <a href="#" class="navbar-brand" data-toggle="dropdown">News <strong class="caret"></strong></a>
     <ul class="dropdown-menu">
       <li>
         <a href="#">A & E Passer </a>
           <ul>
             <li><a href="#">Elementary</a></li>
             <li><a href="#">Secondary</a></li>
            </ul>
        </li>

默认情况下引导。我认为您正在寻找的是一个包含子菜单和下拉菜单的自定义css类的组合

 <li class="dropdown">
   <a href="#" class="navbar-brand" data-toggle="dropdown">News <strong class="caret"></strong></a>
     <ul class="dropdown-menu">
       <li>
         <a href="#">A & E Passer </a>
           <ul>
             <li><a href="#">Elementary</a></li>
             <li><a href="#">Secondary</a></li>
            </ul>
        </li>

。下拉子菜单{
位置：相对位置；
}
.下拉子菜单>.下拉菜单{
排名：0；
左：100%；
利润上限：-6px；
左边距：-1px；
-webkit边界半径：0 6px 6px 6px；
-moz边界半径：0 6px 6px 6px；
边界半径：0 6px 6px 6px；
}
.下拉子菜单：悬停>.下拉菜单{
显示：块；
}
.下拉子菜单>a:之后{
显示：块；
内容：“；
浮动：对；
宽度：0；
身高：0；
边框颜色：透明；
边框样式：实心；
边框宽度：5px 0 5px 5px；
左边框颜色：#中交；
边缘顶部：5px；
右边距：-10px；
}
.下拉子菜单：悬停>a:之后{
左边框颜色：#ffffff；
}
.下拉式子菜单.向左拉{
浮动：无；
}
.下拉子菜单.向左拉>.下拉菜单{
左-100%；
左边距：10px；
-webkit边界半径：6px 0 6px 6px；
-moz边界半径：6px 0 6px 6px；
边界半径：6px 0 6px 6px；
}

您也应该发布CSS。除此之外，您提供的代码缺少一个结束符

和

。看起来您正在使用bootstrapa:hover{color:black；}.navbar nav>li>。下拉菜单{background color:lightgray；}.navbar nav>li>。下拉菜单a{color:black；}。您知道要添加什么吗？谢谢