→ Anonymous
→ Bootstrap Image Gallery

Bootstrap Image Gallery

This bootstrap css example is contributed by Anonymous, on 05-Apr-2024. Component is made with bootstrap css v.3.4. It is responsive. similar terms for this example is Masonry

Tags: Gallery Grid

Author Anonymous

6.3k

v.3.4

Fork Fullscreen

<link rel="stylesheet" href="https://rawgit.com/LeshikJanz/libraries/master/Bootstrap/baguetteBox.min.css">

<div class="container gallery-container">

<h1>Bootstrap 3 Gallery</h1>

<p class="page-description text-center">Fluid Layout With Overlay Effect</p>

<div class="tz-gallery">

<div class="row">

<div class="col-sm-12 col-md-4">
                <a class="lightbox"
                    href="https://raw.githubusercontent.com/LeshikJanz/libraries/master/Related%20images/Bootstrap%20example/bridge.jpg">
                    <img src="https://raw.githubusercontent.com/LeshikJanz/libraries/master/Related%20images/Bootstrap%20example/bridge.jpg" alt="Bridge">
                </a>
            </div>
            <div class="col-sm-6 col-md-4">
                <a class="lightbox"
                    href="https://raw.githubusercontent.com/LeshikJanz/libraries/master/Related%20images/Bootstrap%20example/park.jpg">
                    <img src="https://raw.githubusercontent.com/LeshikJanz/libraries/master/Related%20images/Bootstrap%20example/park.jpg" alt="Park">
                </a>
            </div>
            <div class="col-sm-6 col-md-4">
                <a class="lightbox"
                    href="https://raw.githubusercontent.com/LeshikJanz/libraries/master/Related%20images/Bootstrap%20example/tunnel.jpg">
                    <img src="https://raw.githubusercontent.com/LeshikJanz/libraries/master/Related%20images/Bootstrap%20example/tunnel.jpg" alt="Tunnel">
                </a>
            </div>
            <div class="col-sm-12 col-md-8">
                <a class="lightbox"
                    href="https://raw.githubusercontent.com/LeshikJanz/libraries/master/Related%20images/Bootstrap%20example/traffic.jpg">
                    <img src="https://raw.githubusercontent.com/LeshikJanz/libraries/master/Related%20images/Bootstrap%20example/traffic.jpg" alt="Traffic">
                </a>
            </div>
            <div class="col-sm-6 col-md-4">
                <a class="lightbox"
                    href="https://raw.githubusercontent.com/LeshikJanz/libraries/master/Related%20images/Bootstrap%20example/rails.jpg">
                    <img src="https://raw.githubusercontent.com/LeshikJanz/libraries/master/Related%20images/Bootstrap%20example/rails.jpg" alt="Coast">
                </a>
            </div>
            <div class="col-sm-6 col-md-4">
                <a class="lightbox"
                    href="https://raw.githubusercontent.com/LeshikJanz/libraries/master/Related%20images/Bootstrap%20example/coast.jpg">
                    <img src="https://raw.githubusercontent.com/LeshikJanz/libraries/master/Related%20images/Bootstrap%20example/coast.jpg" alt="Rails">
                </a>
            </div>

</div>

</div>

</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.8.1/baguetteBox.min.js"></script>

<script>
    baguetteBox.run('.tz-gallery');
</script>

More Examples

Responsive image galary with tabs

Author:
Arturo

1 year ago

7.7k

v.5.3
Bento grid bootstrap

Author:
Anonymous

1 year ago

2k

v.5.3
Scroll Animation
Scroll Animation

Author:
Rami AlAjo

1 year ago

3.3k

v.4.6
Bento Grid with Bootstrap 5

Author:
C B

1 year ago

1.7k

v.5.3
Blog Post Grid
Responsive blog post grid

Author:
Kemaya m

1 year ago

2.5k

v.5.3
Responsive Products Grid

Author:
Ross Wille

1 year ago

3.8k

v.5.3
Parallax Image Gallery
An eye-catching gallery section with parallax scrolling effects and image captions.

Author:
Prajwal Hallale

2 years ago

7.7k

v.5.3
Card Layout
Using masonry in cards layout

Author:
almounkez

1 year ago

4.4k

v.5.3
Responsive Card Grid
A responsive grid of cards with hover effects

Author:
Prajwal Hallale

2 years ago

6.7k

v.5.3
Bento Grid Layout with Images

Author:
Juan Martinez

1 year ago

4.4k

v.5.3
Bento Grid with Bootstrap 5

Author:
Juan Martinez

1 year ago

6.8k

v.5.3
Gallery caraousel

Author:
java stories story

8 months ago

1.2k

v.5.3

Didn't find component you were looking for?

Search from 300+ componenent

BootstrapExamples From the makers of tailwindflex.com

BootstrapExamples is a free library offering a diverse range of Bootstrap CSS components. Developed by the community, it's open for anyone to use.

Contacts

Email:

[email protected]

Links

Search

Resources

Free Tailwind CSS Components Free CSS Components

© 2026 BootstrapExamples. All Rights Reserved.

v1.3