超级会员免费看
这篇博客介绍如何利用CSS的定位属性和z-index来创建一个始终悬浮在浏览器窗口顶部的导航栏。通过设置导航栏div为固定定位并调整z-index，使其即使在页面滚动时也能保持在顶端，同时讨论了定位属性的使用和不同定位方式的效果。
知识点：CSS 定位属性、z-index属性
实现效果：
导航条叠加在另外一个div上面（导航栏下面有背景图、背景视频等）
导航条一直在浏览器窗口顶部（也就是拖动浏览器窗口的滚动条时，导航栏依然保持位置不变。）
实现原理：
1、多个div叠加：z-index属性控制，该属性使用的时候，必须同时设置position属性，取值可以是相对定位(relative)、 绝对定位(absolute)或者固定定位(fixed)
2、导航条一直出现在浏览器窗口顶端：使用固定定位。它是以l浏览器窗口为基准进行定位，即当拖动浏览器窗口的滚动条时，它依然保持位置不变。
制作思路：
1、制作一个div，里面放一张图片，用作背景图（也可以放视频）
2、制作一个div，里面放导航条的内容
订阅专栏 解锁全文
扫一扫
1952
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
