"Bootstrap gallery"
Bootstrap 4.1.1 Snippet by Reason706

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!-- Page Content --> <div class="container"> <h1 class="font-weight-light text-center mt-4 mb-0">Thumbnail Gallery</h1> <hr class="mt-2 mb-5"> <div class="row text-center "> <div class="col-lg-3 col-md-4 col-6"> <a href="#" class="d-block mb-4 h-100"> <img class="img-fluid img-thumbnail" src="https://source.unsplash.com/pWkk7iiCoDM/400x300" alt=""> </a> </div> <div class="col-lg-3 col-md-4 col-6"> <a href="#" class="d-block mb-4 h-100"> <img class="img-fluid img-thumbnail" src="https://source.unsplash.com/aob0ukAYfuI/400x300" alt=""> </a> </div> <div class="col-lg-3 col-md-4 col-6"> <a href="#" class="d-block mb-4 h-100"> <img class="img-fluid img-thumbnail" src="https://source.unsplash.com/EUfxH-pze7s/400x300" alt=""> </a> </div> <div class="col-lg-3 col-md-4 col-6"> <a href="#" class="d-block mb-4 h-100"> <img class="img-fluid img-thumbnail" src="https://source.unsplash.com/M185_qYH8vg/400x300" alt=""> </a> </div> <div class="col-lg-3 col-md-4 col-6"> <a href="#" class="d-block mb-4 h-100"> <img class="img-fluid img-thumbnail" src="https://source.unsplash.com/sesveuG_rNo/400x300" alt=""> </a> </div> <div class="col-lg-3 col-md-4 col-6"> <a href="#" class="d-block mb-4 h-100"> <img class="img-fluid img-thumbnail" src="https://source.unsplash.com/AvhMzHwiE_0/400x300" alt=""> </a> </div> <div class="col-lg-3 col-md-4 col-6"> <a href="#" class="d-block mb-4 h-100"> <img class="img-fluid img-thumbnail" src="https://source.unsplash.com/2gYsZUmockw/400x300" alt=""> </a> </div> <div class="col-lg-3 col-md-4 col-6"> <a href="#" class="d-block mb-4 h-100"> <img class="img-fluid img-thumbnail" src="https://source.unsplash.com/EMSDtjVHdQ8/400x300" alt=""> </a> </div> <div class="col-lg-3 col-md-4 col-6"> <a href="#" class="d-block mb-4 h-100"> <img class="img-fluid img-thumbnail" src="https://source.unsplash.com/8mUEy0ABdNE/400x300" alt=""> </a> </div> <div class="col-lg-3 col-md-4 col-6"> <a href="#" class="d-block mb-4 h-100"> <img class="img-fluid img-thumbnail" src="https://source.unsplash.com/G9Rfc1qccH4/400x300" alt=""> </a> </div> <div class="col-lg-3 col-md-4 col-6"> <a href="#" class="d-block mb-4 h-100"> <img class="img-fluid img-thumbnail" src="https://source.unsplash.com/aJeH0KcFkuc/400x300" alt=""> </a> </div> <div class="col-lg-3 col-md-4 col-6"> <a href="#" class="d-block mb-4 h-100"> <img class="img-fluid img-thumbnail" src="https://source.unsplash.com/p2TQ-3Bh3Oo/400x300" alt=""> </a> </div> </div> </div> <!-- /.container -->

Related: See More


Questions / Comments: