Категорія · Основи

CSS, який збирається з вкладених файлів

Вкладеність, змінні збірки, mixin, чому не extend, модулі @use, &, цикли, як це потрапляє в браузер. Вісім уроків після звичайного CSS.

Теми — кожна своїм уроком

SCSS — це CSS плюс вкладеність. На виході однаково звичайний CSS.

$ink: #111 — до збірки. Це не var(--ink): у браузері вже підставлено значення.

Шматок властивостей із параметрами. Не копіпаста flex-центру в десяти місцях.

Групує селектори. Легко склеїти те, чого не хотів. Для кнопки частіше mixin або клас в HTML.

_buttons.scss не компілюється сам. Головний файл підключає шматки.

& — той селектор, усередині якого пишеш. .btn { &:hover } → .btn:hover.

Згенерувати утиліти .mt-1… не вручну. Не пиши на Sass цілу програму.

Без кроку збірки в браузері порожньо. Vite/sass стискає в CSS. Не змішуй три препроцесори.

0/8 тем відкрито. Це вступ курсу, не весь курс на одній сторінці.