Эскизы файлов в папке /imgs/younote/

Для демонстрации каталог разбит на две страницы по 12 файлов. Переключение страниц реализовано на чистом CSS через переключатели под галереей.

Папка: https://alartstudio.ru/imgs/younote/ Показано: 12 файлов на странице (всего 24)
Превью файла youn_note_01.webp 01 WEBP · 320×240
youn_note_01.webp
152 КБ 12.07 · 14:32
Превью файла youn_note_02.webp 02 WEBP · 320×240
youn_note_02.webp
148 КБ 12.07 · 14:31
Превью файла youn_note_03.webp 03 WEBP · 320×240
youn_note_03.webp
160 КБ 12.07 · 14:30
Превью файла youn_note_04.jpg 04 JPG · 1024×768
youn_note_04.jpg
284 КБ 12.07 · 14:28
Превью файла youn_note_05.png 05 PNG · 640×480
youn_note_05.png
196 КБ 12.07 · 14:26
Превью файла youn_note_06.webp 06 WEBP · 640×480
youn_note_06.webp
203 КБ 12.07 · 14:24
Превью файла youn_note_07.jpg 07 JPG · 640×480
youn_note_07.jpg
201 КБ 12.07 · 14:23
Превью файла youn_note_08.png 08 PNG · 640×480
youn_note_08.png
207 КБ 12.07 · 14:21
Превью файла youn_note_09.webp 09 WEBP · 640×480
youn_note_09.webp
210 КБ 12.07 · 14:20
Превью файла youn_note_10.jpg 10 JPG · 640×480
youn_note_10.jpg
215 КБ 12.07 · 14:18
Превью файла youn_note_11.png 11 PNG · 640×480
youn_note_11.png
219 КБ 12.07 · 14:16
Превью файла youn_note_12.webp 12 WEBP · 640×480
youn_note_12.webp
225 КБ 12.07 · 14:15
Превью файла youn_note_13.jpg 13 JPG · 640×480
youn_note_13.jpg
229 КБ 12.07 · 14:13
Превью файла youn_note_14.png 14 PNG · 640×480
youn_note_14.png
231 КБ 12.07 · 14:12
Превью файла youn_note_15.webp 15 WEBP · 640×480
youn_note_15.webp
233 КБ 12.07 · 14:10
Превью файла youn_note_16.jpg 16 JPG · 640×480
younote_16.jpg
238 КБ 12.07 · 14:09
Превью файла youn_note_17.png 17 PNG · 640×480
youn_note_17.png
241 КБ 12.07 · 14:07
Превью файла youn_note_18.webp 18 WEBP · 640×480
youn_note_18.webp
247 КБ 12.07 · 14:05
Превью файла youn_note_19.jpg 19 JPG · 640×480
youn_note_19.jpg
252 КБ 12.07 · 14:04
Превью файла youn_note_20.png 20 PNG · 640×480
youn_note_20.png
256 КБ 12.07 · 14:02
Превью файла youn_note_21.webp 21 WEBP · 640×480
youn_note_21.webp
259 КБ 12.07 · 14:01
Превью файла youn_note_22.jpg 22 JPG · 640×480
youn_note_22.jpg
262 КБ 12.07 · 13:59
Превью файла youn_note_23.png 23 PNG · 640×480
youn_note_23.png
268 КБ 12.07 · 13:57
Превью файла youn_note_24.webp 24 WEBP · 640×480
youn_note_24.webp
271 КБ 12.07 · 13:55

Модель демонстрирует, как может выглядеть постраничный вывод: активная страница переключается через радиокнопки page-1 и page-2, а CSS показывает нужный набор карточек.

Как это может работать на сервере

Здесь показан статический макет. В реальном проекте сервер (PHP, Node.js и т.п.) отдаёт только нужный набор файлов для выбранной страницы, а фронтенд может переключать их через JS или менять классы у блока .file-grid. Этот пример иллюстрирует конечный вид интерфейса без JavaScript.