Урок 47. Обзор урока: Кроссбраузерность: @supports, фолбэки

📁 Раздел: Качество вёрстки ⏱️ Время изучения: ~80 мин 🎯 Сложность: Продвинутая
#supports #not

⚡ Кратко

Кроссбраузерность — это прогрессивное улучшение: сначала рабочий фолбэк, затем улучшение через @supports, вендорные префиксы и проверку по caniuse.com.

О чём урок

Кроссбраузерность — это прогрессивное улучшение: сначала простая рабочая база (фолбэк), которая откроется в любом браузере, затем улучшения сверху через @supports (feature queries), вендорные префиксы и проверку поддержки по caniuse.com. Старый браузер увидит проще, но рабочую страницу — это и есть graceful degradation.

Дальше (урок 48) проверим HTML и CSS валидаторами.

Ключевые понятия

  • @supports
  • fallback
  • progressive enhancement
  • vendor prefixes
  • caniuse.com
  • -webkit-
  • feature query
  • browser matrix

Структура урока

📖 Теория

Понятия, правила и практическая логика.

🔖 Справочник

Инструменты проверки и короткие примеры.

💻 Примеры

Рабочая HTML/CSS связка.

⚖️ Старый vs Новый

Антипаттерн и исправление.

📝 Задания

Практика для самостоятельной проверки.

✅ Решения

Один из корректных вариантов.

🐛 Ошибки

Типовые проблемы и исправления.

🏠 Домашнее задание

Итоговая мини-практика урока.

🔗 Ресурсы

Документация и повторение.

Навигация