Адаптивная галерея изображений

Измените размер окна браузера, чтобы увидеть эффект.

В этом примере используются медиа-запросы для переупорядочения изображений на экранах разных размеров: для экранов шириной более 700 пикселей будут отображаться четыре изображения рядом, для экранов меньше 700 пикселей будут отображаться два изображения рядом. Для экранов меньше 500 пикселей изображения будут складываться вертикально (100%).

Вы узнаете больше о медиа-запросах и адаптивном веб-дизайне позже в нашем учебнике по CSS.