Что такое отзывчивая верстка

Отзывчивая верстка (Responsive Web Design) — это подход к созданию веб-страниц, при котором сайт автоматически адаптируется под разные устройства и размеры экранов. Основные инструменты:

1. Гибкая сетка (Flexbox/Grid)
   css

   Копировать

   .container {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
   }

2. Медиазапросы

   css

   Копировать

   @media (max-width: 768px) {
     .menu { flex-direction: column; }
   }

3. Относительные единицы (%, vh, vw, rem)

   css

   Копировать

   .block { width: 100%; max-width: 1200px; }

4. Резиновые изображения

   css

   Копировать

   img { max-width: 100%; height: auto; }

Ключевой принцип: один HTML-код для всех устройств, но разное CSS-оформление в зависимости от условий.