课程
/前端开发
/HTML/CSS
/导航条菜单的制作
效果如上，代码如下：
2016-07-06
源自：导航条菜单的制作 4-2
正在回答
问题在于：初始化定义a{margin-top:20px}，实际上应将margin-top:20px赋予ul,li{margin-top:20px}
解释：你让所有a的上边距为20px，即所有a标签下移了20px，在a:hover状态时，又重新定义了margin-top=-10px，覆盖了原有的值，因此会脱离其他li元素。
正确的做法是，将margin-top:20px定义给ul,li，如此，在a:hover状态下也能继承ul,li的margin-top:20px的属性，再叠加以margin-top:-10px，达到只在顶部凸出10px的效果。
CharlesLvm 提问者
你的a标签中“margin-top:20px;”在hover状态下是“margin-top:-10px;”两者就相差了30像素
举报
水平、垂直、圆角导航条菜单，让您的技术探索之路更高效
