Bootstrap 4 Loader Code Example


Example 1: circlular waiting icon bootstrap

<div class="spinner-border" role="status">   <span class="sr-only">Loading...</span> </div>

Example 2: bootstrap loader

<div class="spinner-border text-primary" role="status">   <span class="sr-only">Loading...</span> </div> <div class="spinner-border text-secondary" role="status">   <span class="sr-only">Loading...</span> </div> <div class="spinner-border text-success" role="status">   <span class="sr-only">Loading...</span> </div> <div class="spinner-border text-danger" role="status">   <span class="sr-only">Loading...</span> </div> <div class="spinner-border text-warning" role="status">   <span class="sr-only">Loading...</span> </div> <div class="spinner-border text-info" role="status">   <span class="sr-only">Loading...</span> </div> <div class="spinner-border text-light" role="status">   <span class="sr-only">Loading...</span> </div> <div class="spinner-border text-dark" role="status">   <span class="sr-only">Loading...</span> </div>

Example 3: bootstrap loader

<div class="d-flex align-items-center">   <strong>Loading...</strong>   <div class="spinner-border ml-auto" role="status" aria-hidden="true"></div> </div>

Example 4: how to add loader in bootstrap

<div class="spinner-border text-primary"      id="spinner"role="status">     <span class="sr-only">Loading...</span> </div>

Example 5: bootstrap loader

<div class="spinner-grow" role="status">   <span class="sr-only">Loading...</span> </div>

Example 6: bootstrap loader

<div class="spinner-border" style="width: 3rem; height: 3rem;" role="status">   <span class="sr-only">Loading...</span> </div> <div class="spinner-grow" style="width: 3rem; height: 3rem;" role="status">   <span class="sr-only">Loading...</span> </div>

Comments

Popular posts from this blog

Chemistry - Bond Angles In NH3 And NCl3

Are Regular VACUUM ANALYZE Still Recommended Under 9.1?

Can Feynman Diagrams Be Used To Represent Any Perturbation Theory?