Question

我一直未能正确使用导航栏。在我的base.html中，我在body部分中有这个代码片段。（或者导航栏应该在头部？！）

  <body>

          <div class="row">
              <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">

                      <div class="navbar-header">
                          <a class="navbar-brand" href="http://...">Company</a>
                      </div>
                      <div class="navbar-collapse collapse">
                          <ul class="nav navbar-nav navbar-right">
                              <li><a href={{ url_for("strategy_index") }}>Strategies</a></li>
                              <li><a href={{ url_for("data_index") }}>Data</a></li>
                              <li><a href={{ url_for("view_index") }}>Views</a></li>
                          </ul>
                      </div>
              </div>
          </div>



            {% block content %}

            {% endblock %}

  </body>

然后我用

{% extends "base.html" %}
{% block content %}
        <div class="row">

         HELLO WORLD

        </div>

{% endblock %}

但是，HELLO WORLD隐藏在导航栏下方。如何阻止导航栏占用的区域？

非常感谢托马斯

Answer 1

添加

padding-top: 70px;

到body。它就在documents：

中

固定导航栏将覆盖您的其他内容，除非您在主体顶部添加填充。尝试自己的价值观或使用下面的代码段。提示：默认情况下，导航栏高50像素。

Bootstrap中导航栏下的区域

1 个答案: