如何使导航栏上的“位置固定”设置不改变页面的布局?

因此,我的顶部有一个导航栏,底部有一个页脚,中间有一个大图像。我使用边距放置了所有内容(导航的边距顶部:0,页脚的边距底部:0,图像的边距:3%自动。图像在我的页面上居中,一切都很好。但是,当我设置导航位置时栏固定,图像的边距似乎从页面的开头而不是导航栏的末尾开始计数(这导致我的图像与导航栏重叠,而不是位于页脚和边距之间)。我知道修复它的唯一方法正在制作第二个不可见的 div,其大小与我的导航栏完全相同,但我相信这不是最实用的方法。

我不知道是否有必要在那里放置 HTML/CSS 代码,我想我描述了所有重要的事情。预先感谢您的帮助


眼眸繁星
浏览 119回答 2
2回答

呼啦一阵风

尝试一下position:sticky。如果元素的高度固定,效果最好。

RISEBY

设置position: fixed从文档流中删除该元素。一种可能的解决方案是为内容添加一个容器,在您的情况下是图像的容器 div,并在容器上设置固定的上边距或顶部填充以适应导航栏的高度。
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

Html5