.container {
/*We need this beacuse we're using
a fixed navbar*/
margin-top: 70px;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
<nav class="navbar fixed-top navbar-expand-md navbar-light bg-light">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-item nav-link active" href="#">Home <span class="sr-only">(current)</span></a>
<a class="nav-item nav-link" href="#">Features</a>
<a class="nav-item nav-link" href="#">Pricing</a>
<a class="nav-item nav-link disabled" href="#">Disabled</a>
</div>
</div>
</nav>
<div class="container">
<p>
This is some long content to test the fixed navbar. Suspendisse arcu ex, dapibus nec scelerisque faucibus, sodales et orci. Aliquam vitae facilisis velit, a accumsan velit. Pellentesque porta lacus ipsum, ut fermentum urna porttitor in. Maecenas sit amet
rhoncus massa. Etiam posuere maximus ornare. Pellentesque fringilla est sed orci pulvinar dapibus. Sed porttitor felis et dui semper, eu venenatis justo consequat. Fusce condimentum eros non massa venenatis, non pharetra est sodales. Aliquam vulputate
vehicula ipsum, sed consectetur felis efficitur ut. Sed ullamcorper cursus odio, ac vulputate ligula. Proin at tincidunt erat. Integer ultricies blandit tortor vitae pretium. Vivamus porta dui non vestibulum ornare. In tincidunt, urna a vehicula malesuada,
nisi mi vehicula risus, sit amet consequat eros orci a nisi. Nullam bibendum lectus eget pharetra vehicula. Nunc congue nibh id porttitor mollis. Quisque in quam eget eros pulvinar faucibus. Praesent nec finibus nisl, nec varius ante. Mauris id efficitur
ligula. Phasellus ultricies massa ut laoreet pulvinar. Maecenas iaculis neque quis pharetra laoreet. Mauris aliquam non arcu eu aliquet. Donec vel porttitor risus, at tristique sem. Phasellus euismod libero congue mattis sodales. Integer nisi orci,
ullamcorper sit amet ultrices eget, vulputate id odio. Sed pulvinar vitae odio sed bibendum. Nullam erat quam, dapibus quis volutpat vel, iaculis non ipsum. Mauris id placerat lacus, ut ornare turpis. Nullam vel malesuada ante. Aenean velit augue,
vulputate vitae lorem non, ullamcorper varius mi. Maecenas pharetra eget magna ac consectetur. Nullam mattis tristique nunc, sed dictum est congue nec. Nullam ut ligula turpis. Sed elementum, eros et interdum fermentum, lacus augue volutpat ipsum,
et tristique odio massa at mauris. Sed venenatis, odio in condimentum venenatis, felis massa commodo ante, ac ullamcorper magna ex sit amet ligula. Pellentesque porta, mi at luctus condimentum, nisi ex sagittis lacus, ac pulvinar ex diam ut diam.
Sed ornare fringilla diam. Aenean sit amet neque sit amet nulla fringilla molestie. Vestibulum tincidunt nulla in aliquet convallis. Etiam accumsan varius convallis. Praesent congue aliquam lacus vitae condimentum.
</p>
</div>