Для того чтобы заполнить блоки с одинаковыми классами разными фотографиями в Pug (бывший Jade), вам потребуется использовать цикл и условия.
Во-первых, вам следует создать массив с фотографиями, которые вы хотите использовать. Например, вы можете создать массив photos, содержащий имена файлов изображений:
- const photos = ['photo1.jpg', 'photo2.jpg', 'photo3.jpg'];
Затем, вы можете использовать цикл each для прохода по массиву и создания блоков с фотографиями:
each photo in photos
.block
img(src=`path/to/images/${photo}`, alt='Photo')
Здесь мы используем цикл each для каждого элемента массива photos, создавая блок с классом .block, а внутри него размещаем изображение с помощью тега img. Примечательно, что мы используем интерполяцию (${photo}) для подстановки значения каждого элемента массива photos в путь к изображению.
Результирующий HTML будет выглядеть примерно так:
<div class="block"> <img src="path/to/images/photo1.jpg" alt="Photo"> </div> <div class="block"> <img src="path/to/images/photo2.jpg" alt="Photo"> </div> <div class="block"> <img src="path/to/images/photo3.jpg" alt="Photo"> </div>
Таким образом, вы создадите блоки с одинаковым классом, но разными фотографиями. Не забудьте заменить path/to/images на путь к папке с вашими изображениями.