Как писать CSS с @scope: Полный разбор синтаксиса, изоляция стилей и donut scoping

Помните головную боль с переопределением стилей во вложенных компонентах? Когда в навигации нужно стилизовать ссылки, но не трогать те, что внутри выпадающих меню? Раньше — сбросы и !important. Теперь — нативный @scope.

🔥 Событие, которого мы ждали годы: последний из мейнстрим-браузеров (да, Firefox) включил поддержку @scope. Это значит, что технология получила статус Baseline и готова к продакшену.

В новом материале — только практика, без воды:
🔹 Как работает donut scoping (скоуп в виде бублика)
🔹 Где писать @scope: во внешних CSS или прямо в HTML-компонентах
🔹 Чем :scope в CSS отличается от :scope в JavaScript

Код можно копировать и вставлять в проект уже сегодня.

🖥 Читать статью

📱 @dev_notes_ru

#CSS #Frontend #JavaScript #scope