Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Bootstrap 4 Layouts: Responsive Single-Page Design

via LinkedIn Learning

Go to class Write review

Details

Go to class

Provider

LinkedIn Learning
Pricing

Free Trial Available
Languages

English
Certificate

Certificate Available
Duration & workload

3-4 hours
Sessions

On-Demand

Found in

Overview

Find out how Bootstrap can transform your standard HTML websites into inspired single-page designs.

Syllabus

Introduction

Creating a Bootstrap 4 layout

1. Building a Header and Footer

Layout principles
Coding Bootstrap navigation
Adding styles to our project
Making our navigation responsive
Using spacing classes and icons
Creating a header layout
Using columns in our layout

2. Bootstrap Layout Components

Using a multicolumn format
Working with the media component
Creating a grid of photos
Working with carousels
Nesting a layout
Creating an icon layout
Floating layout elements
Using the card layout classes

3. Adding Interactivity

Reusable modal templates
Using Scrollspy
Scrolling to a location

4. Creating Animations

Animating our menu
Keyframe animation
Animating with Scrollspy

Conclusion

Next steps

Taught by

Ray Villalobos

Reviews

4.5 rating at LinkedIn Learning based on 44 ratings

Start your review of Bootstrap 4 Layouts: Responsive Single-Page Design