In this guide, we will discuss Responsive Demo in Bootstrap. Bootstrap provides a handful of helper classes, for faster mobile-friendly development. These can be used for showing and hiding content by device via media query, combined with large, small, and medium devices.
Use these sparingly and avoid creating entirely different versions of the same site. Responsive utilities are currently only available for block and table toggling.
| Classes | Devices |
|---|---|
| .visible-xs | Extra small (less than 768px) visible |
| .visible-sm | Small (up to 768 px) visible |
| .visible-md | Medium (768 px to 991 px) visible |
| .visible-lg | Larger (992 px and above) visible |
| .hidden-xs | Extra small (less than 768px) hidden |
| .hidden-sm | Small (up to 768 px) hidden |
| .hidden-md | Medium (768 px to 991 px) hidden |
| .hidden-lg | Larger (992 px and above) hidden |
| Example | Description |
|---|---|
| Card Responsive | This example indicates about Card structure in Bootstrap |
| simple Testimonials | This example indicates about Testimonials structure in Bootstrap |
| Video grid | This example indicates about Grid Video structure in Bootstrap |
| Banner image | This example indicates about Banner Image structure in Bootstrap |
| Carousel with face indicators | This example indicates about Carousel with face indicators structure in Bootstrap |
Next Topic : Click Here
Pingback: Bootstrap - Images Demo | Adglob Infosystem Pvt Ltd