Sign In Start Free Trial
Account

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying The Missing Bootstrap 5 Guide
  • Table Of Contents Toc
  • Feedback & Rating feedback
The Missing Bootstrap 5 Guide

The Missing Bootstrap 5 Guide

By : Jeppe Schaumburg Jensen
4.3 (14)
close
close
The Missing Bootstrap 5 Guide

The Missing Bootstrap 5 Guide

4.3 (14)
By: Jeppe Schaumburg Jensen

Overview of this book

Bootstrap is one of the world's most popular and easy-to-use frontend UI toolkits for building responsive websites, but few know how to get the most out of its vast range of components, utilities, JavaScript plugins, and other features. The Missing Bootstrap 5 Guide will help you customize Bootstrap 5 with Sass to achieve a layout that stands out from the crowd, enabling you to create something unique that doesn't look like it was created with Bootstrap. With this practical guide to Bootstrap customization, developers working with Bootstrap will be able to utilize powerful customization techniques to create websites with unique designs and exclusive features. You’ll see how you can develop a visually appealing website quickly and easily by taking a hands-on approach to customizing your website using advanced features of CSS, Sass, and JavaScript. Starting with learning how the Bootstrap 5 visual style is created with Sass, you’ll find out how to customize it to fit your needs while achieving the website look you want. You'll then use this knowledge to create a website using most of Bootstrap 5's components and customization with Sass and JavaScript. Finally, you’ll explore various advanced Bootstrap 5 topics related to Sass, CSS, JavaScript, and source code optimization. By the end of this book, you'll be able to design and build modern, captivating, and unique websites on your own using the immense capabilities of Bootstrap 5.
Table of Contents (17 chapters)
close
close
1
Part One – Customizing Bootstrap 5 with Sass
In Progress | 0 / 1 sections completed | 0%
7
Chapter 6: Understanding and Using the Bootstrap 5 Utility API
In Progress | 0 / 6 sections completed | 0%
8
Part Two – Creating a Unique-Looking Website Based on Bootstrap 5 and Customization
In Progress | 0 / 1 sections completed | 0%
9
Chapter 7: Creating the Website Using Default Bootstrap 5 Elements
In Progress | 0 / 8 sections completed | 0%
12
Part Three – Advanced Topics Related to Bootstrap 5
In Progress | 0 / 1 sections completed | 0%
16
Other Books You May Enjoy
In Progress | 0 / 3 sections completed | 0%

Exploring the Bootstrap 5 variables

To customize any element of Bootstrap 5, you will start by looking at the _variables.scss file. This file contains all the variables used by Bootstrap 5, including variables for global options, colors, layout, content (including typography), forms, components, helpers, and utilities. So, for example, to know which part of a component can be customized, you simply need to search for the component name within the _variables.scss file. Then, you will find all the relevant variables with their default values grouped together. You now need to use these same variable names in your own Sass file to change it. You will learn exactly how to do this in the next chapter.

The variables have been carefully ordered by the team behind Bootstrap since some variables reference other variables. The order in which the variables for different components appear is not alphabetical, so my best suggestion to find them is to scroll through the file or search for the...

Unlock full access

Continue reading for free

A Packt free trial gives you instant online access to our library of over 7000 practical eBooks and videos, constantly updated with the latest in tech

Create a Note

Modal Close icon
You need to login to use this feature.
notes
bookmark search playlist download font-size

Change the font size

margin-width

Change margin width

day-mode

Change background colour

Close icon Search
Country selected

Close icon Your notes and bookmarks

Delete Bookmark

Modal Close icon
Are you sure you want to delete it?
Cancel
Yes, Delete

Delete Note

Modal Close icon
Are you sure you want to delete it?
Cancel
Yes, Delete

Edit Note

Modal Close icon
Write a note (max 255 characters)
Cancel
Update Note

Confirmation

Modal Close icon
claim successful

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY