Bootstrap使用固定的导航栏和锚标签跳转到部分

Question

我正在尝试使用锚标签导航到网页的特定部分，使用bootstrap和固定在顶部的导航栏。问题是，当我单击锚链接时，它们没有正确滚动到该部分的开头，它滚动到该部分的开始，因为应用于主体的边距。

body {
    margin-top: 60px;
}

我该如何解决这个问题？

有关完整演示，请参阅以下jsFiddle：http://jsfiddle.net/6kwrY/

Answer 1

解决方案是使用：

.section {
    padding-top: 60px;
    margin-top: -60px;
}

Answer 2

通过填充为所有部分p添加边距，除非它们被称为“第一个”。

body {
    margin-top: 60px;
}

section p {
    font-size: 30px;
    line-height: 1.5;
    margin-bottom: 35px;
    padding-top: 60px;
}

#first p {
        padding-top: 0px;
}