Providing a navbar markup

You'll remember that we have not brought over the precompiled CSS files from Bootstrap, nor have we yet compiled CSS from our LESS files. We'll do the latter shortly. But first, let's put at least one Bootstrap-specific element in place, that is, the navbar.

Initially, we want only Bootstrap's basic navbar (we'll add other details later). I've used the markup taken from Bootstrap's documentation and adjusted it in the following ways:

  • I've added the class navbar-static-top since we want the navbar to be positioned at the very top, and yet scroll with the page
  • I've linked the brand link to index.html
  • I've changed the parent div tags to semantic HTML5 nav tags

The preceding adjustments lead to the following result, nested with ...

Get Bootstrap Site Blueprints now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.