css制作二级下拉导航时，鼠标放上，隐藏的导航不会停留！

补一个坑，之前一直写css二级导航时，鼠标经过顶部菜单，隐藏的二级导航会显示出来，而且鼠标移初顶部导航并移入二级导航时，隐藏导航不应该立即消失，而是要继续显示！

看如下布局的html及css代码：

 <li>
                 <a href="#">联通</a>
                 <ul class="nav_ul_ul">
                    <li>电信</li>
                    <li>联通</li>
                    <li>移动</li>
                 </ul>
 </li>

css代码如下：

li a:hover ~ ul{display:block;}

这样的话，就会出现我们开始说的bug，鼠标移出，ul里面的内容立马跟着不显示了，要是用户想点击里面的“移动”，根本点击不到，那么怎么解决呢？继续看

解决办法：

鼠标经过，隐藏和显示外边的盒子元素就会出现这个问题，那么将需要隐藏显示的模块，放到“a”元素里面，变成a的子元素，或者将css改为经过li时，模块显示，代码如下：

方法一：

 <li>
 <a href="#">联通
                 <ul class="nav_ul_ul">
                    <li>电信</li>
                    <li>联通</li>
                    <li>移动</li>
                 </ul>
</a>
               
 </li>

方法二：

li:hover a ul{display:block;}

这样就能完整的实现一个二级的导航了！