Справочник урока
| Инструмент | Зачем нужен | Мини-пример |
|---|---|---|
порядок свойств | Единый порядок внутри правила | позиционирование → блочная модель → типографика → оформление |
секции-комментарии | Видимые границы блоков | /* ===== Карточка ===== */ |
файловая структура | Разбивка CSS по назначению | base/, layout/, components/, utilities/ |
@import | Сборка файлов; порядок = каскад | @import "components/card.css"; |
@layer | Явный приоритет слоёв каскада | @layer reset, base, components, utilities; |
ITCSS | Слои от общих к конкретным | settings → tools → generic → elements → objects → components → utilities |
utility-first | Маленькие классы-утилиты | .mt-4, .flex, .sr-only |
документация | Фиксирует договорённости | README: токены, именование, overrides |
⚠️ Проверить по документации:
@layer — современная возможность каскадных слоёв. См. MDN: @layer и caniuse.