Запустить
<!DOCTYPE html> <html lang="ru"> <head> <title>Bootstrap 4 - Создание адаптивной галереи изображений на Gridify</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <!-- Bootstrap CSS --> <link href="/examples/vendors/bootstrap-4/css/bootstrap.min.css" rel="stylesheet"> <style> @media (min-width: 576px) { .img-row>img { display: inline-block; margin-bottom: 1rem; } } </style> </head> <body> <div class="card-columns img-row"> <img class="img-fluid" src="/examples/images/for-image-gallery/img_01.jpg" alt=""> <img class="img-fluid" src="/examples/images/for-image-gallery/01.jpg" alt=""> <img class="img-fluid" src="/examples/images/for-image-gallery/02.jpg" alt=""> <img class="img-fluid" src="/examples/images/for-image-gallery/03.jpg" alt=""> <img class="img-fluid" src="/examples/images/for-image-gallery/img_02.jpg" alt=""> <img class="img-fluid" src="/examples/images/for-image-gallery/img_03.jpg" alt=""> <img class="img-fluid" src="/examples/images/for-image-gallery/05.jpg" alt=""> <img class="img-fluid" src="/examples/images/for-image-gallery/06.jpg" alt=""> <img class="img-fluid" src="/examples/images/for-image-gallery/07.jpg" alt=""> </div> </body> </html>