利用定位实现二级菜单制作，牢记！子绝父相！

前言：~~~我是一颗还在长成的大白菜~~~

二级菜单在网页中很常见，淘宝，京东的导航栏都有，如下图红色框区域(鼠标滑过，出现红色框区域)

如何利用html&css制作一个二级菜单？

  ** 原理：** 当鼠标滑过，二级菜单区域显示；当鼠标悬停，二级菜单保留；当鼠标移出时，二级菜单隐藏。

主要结构：

1. html结构：

       一个header元素，里面放置一个列表；
       子元素是li，在第4个li中添加下拉菜单
   

2. css结构：

        分别给li设置样式，设置鼠标移入li的样式；给li添加相对定位； 
        设置二级菜单的样式，鼠标移入才显示；
        添加伪元素，用于消除li的下边框;
        (li下边框看不见的原因是因为添加了伪元素，并设置背景与li保持一致，遮住li的下边框)
   

3. 页面效果