CSS自定义导航栏悬浮(三种实现方式)

html-css0120

CSS自定义导航栏悬浮(三种实现方式),第1张

提供三种自定义导航栏悬浮的方法

在自定义组件中设定css 样式:

利用 position: fixed

利用 position: fixed

最近在用element ui做后台管理系统,左侧菜单比较多了,所以需要拉动网页滚动条才可以看完整个菜单,

所以就把顶部导航浮动 fixed后 到一定高度就浮动起来,

但是中途遇到一个大坑,就是在浏览器中,滚动发高度刚好在导航需要浮动的高度山下不断 上下滑动滚动条的时候 ,页面会出现不断的闪烁,不知道大家有没有遇到个这样的bug

好了 不批话多了,直接看解决方法

重点来了。。。。。。。。

尼玛重点在那点啊。。

接到往下来 就是在我浮动的导航div外面在包一层div 就觉得了

要浮动的话,必须要加上display:block,看了一下你的代码,它看起来是浮动了,但是事实上是因为你给a加了padding,所以,它们之间的距离是padding出来的,而不是浮动出来……如果,你把padding换成margin的话,它就会挤在一起……