引导导航栏后面的空间

使用引导程序navbar，我试图弄清楚如何使其不隐藏主体部分的顶部。

实际上，使用这里推荐的方法可以很好地解决这个问题：

Twitter Bootstrap - 顶部导航栏阻挡页面顶部内容 https://stackoverflow.com/questions/10336194/twitter-bootstrap-top-nav-bar-blocking-top-content-of-the-page

但仍然有一些东西不起作用：当你有这样的链接时：

<li><a href="#section1">Go to Section 1</a></li>
<li><a href="#section2">Go to Section 2</a></li>
<li><a href="#section3">Go to Section 3</a></li>
<li><a href="#section4">Go to Section 4</a></li>

And

<h4 id="Section 1">Section 1</h4>
<p>Content of Section 1</p>
<p><a href="#">Back to Top</a></p>

<h4 id="Section 2">Section 2</h4>
<p>Content of Section 2</p>
<p><a href="#">Back to Top</a></p>

<h4 id="Section 3">Section 3</h4>
<p>Content of Section 3</p>
<p><a href="#">Back to Top</a></p>

<h4 id="Section 4">Section 4</h4>
<p>Content of Section 4</p>
<p><a href="#">Back to Top</a></p>

在这种情况下，例如，当您单击第 2 节直接链接（或快捷方式）时，页面会正确向下滚动直到第 2 节，但它将其开头隐藏在引导导航栏后面。

关于如何解决这个问题有任何线索吗？

通过将 :target 伪选择器添加到链接的 CSS，您可以将定义的填充应用于所选链接（只要它在浏览器中显示为：www.example.com#link1）。

我花了最后 2 个小时尝试搜索网络，试图找到 Jquery 或 JS 将填充应用于目标 div，并在修改我的 Google 后搜索词找到了这个 http://css-tricks.com/on-target/

也许有一种方法可以用旧版浏览器来证明这一点，但就目前而言，这让我成为一个快乐的露营者。