Sign In Start Free Trial

Book Overview & Buying
Table Of Contents
Feedback & Rating

Learning Bootstrap

By : Shenoy

3.4 (5)

Learning Bootstrap

3.4 (5)

By: Shenoy

Overview of this book

If you want to learn to build enterprise-level websites efficiently with Bootstrap, this book is for you. You must have a basic and fundamental understanding of HTML, CSS, and JavaScript; however, there is no need to have prior Bootstrap experience.

Preface

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Free Chapter

1. Getting Started with Bootstrap

1. Getting Started with Bootstrap

Mobile-first design

Why Bootstrap

Summary

2. Installing and Customizing Bootstrap

2. Installing and Customizing Bootstrap

Including Bootstrap in your HTML file

The Bootstrap CDN

Overriding with custom CSS

Using the Bootstrap customizer

Deep customization of Bootstrap

Putting it all together

Summary

3. Using the Bootstrap Grid

3. Using the Bootstrap Grid

Using the Bootstrap Grid classes

Using the Bootstrap variables and mixins

Creating a blog layout with the Bootstrap Grid mixins and variables

Summary

4. Using the Base CSS

4. Using the Base CSS

Implementing the Bootstrap Base CSS

Customizing the Base CSS using LESS variables

Summary

5. Adding Bootstrap Components

5. Adding Bootstrap Components

Components and their usage

Summary

6. Doing More with Components

6. Doing More with Components

Components to streamline your web designing projects

Summary

7. Enhancing User Experience with JavaScript

7. Enhancing User Experience with JavaScript

Streamlining your projects with official plugins

Summary

8. Bootstrap Technical Hub – A One-stop Shop for Powerful Bootstrap Utilities

8. Bootstrap Technical Hub – A One-stop Shop for Powerful Bootstrap Utilities

Themes and templates

Ready-made resources and plugins

Development tools and editors

Official Bootstrap resources

Summary

Index

Index

Customer Reviews

3.4 (5)

5 star

0%

4 star

40%

3 star

60%

2 star

0%

1 star

0%

Using the Bootstrap variables and mixins

You can use variables and mixins in Bootstrap to build semantic layouts. We will now look at variables used in Bootstrap for the grid layout.

Bootstrap comes with built-in variables and mixins for building semantic grid layouts.

Bootstrap Grid variables

The LESS code for the Bootstrap Grid contains three variables:

@grid-columns: This variable is used to define the maximum number of columns displayed on desktops and large screens. The default value is 12. However, by assigning a specific value, we can change the default value to less or more than 12, as per the requirement.
@grid-gutter-width: This variable is the width of the gutter. The gutter is the vertical space between the grid columns, and the default value of the gutter width is 30 px.
@grid-float-breakpoint: This variable is the minimum width with which the elements with the col-lg-x class start getting displayed in the columns. The default value of this attribute is the same as the minimum tablet...

Visually different images

CONTINUE READING

83

Tech Concepts

36

Programming languages

73

Tech Tools

Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.

Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.

50+ new titles added per month and exclusive early access to books as they are being written.

Learning Bootstrap

Search

Your notes and bookmarks