O'Reilly logo

Bootstrap 4 Site Blueprints by Ian Whitley, David Cochran, Bass Jobsen

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Adding the final touches

In this section, we will enhance the details that hold our design together. First, we'll enhance the h1 headings for each of our major sections and add some needed top and bottom padding to each section. Then, we'll enhance the navigation experience by adding ScrollSpy to the navbar and using jQuery to animate the scrolling action when triggered by a click on the navbar item.

Let's begin by enhancing the size and contrast of our major h1 headings for each section and increasing the top and bottom padding. If you pause to look at these h1 headings, you may note that they are rather lackluster.

Enlarging these headings, bringing the contrast down a little, and providing extra padding will make a big difference. We only want ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required