Boostrap 滚动监听 不滚动解决方案
<div class="col-xl-6 text-right">
<ul class="nav navbar navbar-nav">
<li class="nav-item"><a class="nav-link active" href="#about" style="width:100px" >ABOUT</a></li>
<li class="nav-item"><a class="nav-link" href="#portfolio" style="width:120px">PORTFOLIO</a></li>
<li class="nav-item"><a class="nav-link" href="#contact" style="width:100px">CONTACT</a></li>
</ul>
</div>
<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
nav-item, nav-link 标语必须准确 head头必须添加三个script引用 否则无法实现滚动