bootstrap : onclick navbar margin-top = 10 vh;答案

【问题标题】：bootstrap : onclick navbar margin-top = 10 vh;bootstrap : onclick navbar margin-top = 10 vh;
【发布时间】：2018-12-24 01:23:20
【问题描述】：

当我点击导航栏的链接时，我想查看整个部门。

$('body').scrollspy({ target: '#navbarSupportedContent' })

<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<body data-spy='scroll' data-target='#navbarSupportedContent'>
  <div class="collapse navbar-collapse" id="navbarSupportedContent"> 
    <section id="accueil">1</section> 
    <section id="recherche">2</section> 
    <section id="presentation">3</section> 
    <section id="parcours">4</section> 
    <section id="competence">5</section> 
    <section id="projet">6</section> 
    <section id="cequejaime">7</section> 
    <section id="contact">8</section>
  </div>
</body>

【问题讨论】：

请提供导致问题的代码。
请编辑您的问题并将此代码添加到问题陈述中。
有什么偏移的例子吗
@WaleedIqbal 我是新人，我的问题来自偏移量，但我不知道该给你看什么
好的，我编辑了问题以包含代码，但是 sn-p 不起作用，所以它几乎没有帮助。 @Atlas，您还有更多可以提供帮助的代码吗？请编辑问题并将代码放入sn-p。

标签： html css

【解决方案1】：

你的问题是你没有考虑到你的导航栏是绝对定位的，并且从你的页面流中删除。因此，您的部分会滑入其后面，并且您部分的前 10vh 值会消失在导航栏后面。

解决此问题的一种方法是将部分的高度增加到 100vh 并在顶部添加填充，以便将您的内容推到导航栏下方。试试这是你的 CSS，而不是你现在拥有的。

#presentation, #parcours, #competence, #projet, #cequejaime, #contact {
    height: 100vh;
    padding-top: 10vh;
}

【讨论】：

是的，我已经尝试过了，效果很好（你现在可以在我的网站上看到它）但我真的想找到一个带有属性偏移的选项
我不明白你的意思。