大佬教程收集整理的这篇文章主要介绍了如何将导航栏与页面的其余部分分开，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
我是 Web 开发的新手，我正在 VSCode 中开发 Django 框架。我一直在尝试为 web 应用程序制作一个用户界面，它在屏幕左侧有一个菜单，顶部有一个导航栏，上面写着“主页”（下图）。在那里，我需要将所有文本和照片放在页面的其余部分，当我向下滚动时，我只想移动那部分，就像在真正的 Web 应用程序中一样。但我不知道该怎么做，我必须使用 JavaScript 还是我可以在 HTML/CSS 中完成？
正如您在图片中看到的，段落覆盖了导航栏。
谢谢！
您正在寻找的是 CSS position: fixed 属性。例如：
<div class="navbar" style="position: fixed;">
https://www.w3schools.com/howto/howto_css_fixed_menu.asp
,您必须使用 base_generic_page 来包含所有应用程序页面。
basic_generic_page 有 nav_bar 或 side_bar
<html lang="en">
<head>
{% block title %}<title>Local Library</title>{% endblock %}
</head>
<body>
{% block sidebar %}<!-- insert default navigation text for every page -->{% endblock %}
{% block content %}<!-- default content TEXT (typically empty) -->{% endblock %}
</body>
</html>
您可以继承应用程序页面的基础并以这种方式重写内容块：
{% extends "base_generic.html" %}
{% block content %}
<h1>Local Library Home</h1>
<p>Welcome to <em>LocalLibrary</em>,a very basic Django website developed as a tutorial example on the Mozilla Developer Network.</p>
{% endblock %}
来源：https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Home_page
,很像position:fixed
你也可以给 position: sticky
具有占用空间的额外好处
实际上取决于您希望页面如何流动
以上是大佬教程为你收集整理的如何将导航栏与页面的其余部分分开全部内容，希望文章能够帮你解决如何将导航栏与页面的其余部分分开所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。