Skip to main content

Posts

Showing posts from August, 2019

What is Bootstrap 4?

The Bootstrap 4  is the newest version of  Bootstrap , which is the most popular HTML, CSS, and JavaScript framework for developing responsive, mobile-first web sites. The new features are, Bootstrap 4 Source CSS files Converted in SCSS. Bootstrap 4 has 5 grid system ( .col-, .col-sm-3, .col-md-3, .col-lg-3, .col-xl-3 ).  Bootstrap 4 has removed the xs from the lowest breakpoint. Therefore, ( col- ) covers all devices. Bootstrap 4 has changed the offset class ( .offset-md-4 ) In Bootstrap 3 we are used this ( .img-responsive ) class for the responsive image.  Bootstrap 4 has changed the class for a responsive image ( .img-fluid ). Bootstrap 4 has changed to ( .form-control-lg ) and ( .form-control-sm ) to increase and decrease the input size.  To learn more click here . 

Bootstrap 4 Spinners

Bootstrap 4 Spinners The Spinner is a major component of a website that ensures all necessary libraries, programs, contents, and images are loaded, which is essential during the startup phase of running a website. Let's see how to create a Bootstrap 4 Spinner? In order to create lightweight bordered spinner, include .spinner-border class to your element. <div class="container">     <div class="spinner-border"></div> </div> Demo See the Pen Bootstrap 4 Spinners by Prime Study Hub ( @PrimeStudyHub ) on CodePen . Color Variations You can create spinners with different color variations like below example, See the Pen Bootstrap 4 Colored Spinners by Prime Study Hub ( @PrimeStudyHub ) on CodePen . Growing Spinners In order to create a growing spinner instead of border spinner, Use .spinner-grow class along with text color utilities to change its appearance. Let's look into a detailed example, See the Pen B