<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://kit.fontawesome.com/d5fba335cd.js" crossorigin="anonymous"></script>
<nav>
<a href="#first"><i class="far fa-user"></i></a>
<a href="#second"><i class="fas fa-briefcase"></i></a>
<a href="#third"><i class="far fa-file"></i></a>
<a href="#fourth"><i class="far fa-address-card"></i></a>
</nav>
<div class= 'container'>
<section id= 'first'>
<h1>First</h1>
</section>
<section id= 'second'>
<h1>Second</h1>
</section>
<section id= 'third'>
<h1>Third</h1>
</section>
<section id= 'fourth'>
<h1>Fourth</h1>
</section>
</div>
