W3docs

sass · Основы Sass

Директива ... - это набор вложенных правил, который может создать стилевой блок в корне документа.

Answers

  • @at-root
  • @media
  • @extend
  • Ни один из вышеперечисленных
# Объяснение директивы @at-root в SCSS Директива `@at-root` в SCSS - это инструмент, который позволяет создавать стилевой блок в самом корне документа. Это помогает избежать вложенности, которое обычно происходит при создании стилей в SCSS. Правила, объявленные внутри директивы `@at-root`, вставляются в корневой уровень выходного CSS-файла, а не в текущие вложенные правила. Пример применения директивы `@at-root`: ```scss .block { color: black; @at-root { .block-modifier { color: white; } } } ``` В результате компиляции получим: ```css .block { color: black; } .block-modifier { color: white; } ``` Как видно из примера, блок `.block-modifier` был размещен на корневом уровне, несмотря на то, что он был объявлен внутри блока `.block` благодаря использованию директивы `@at-root`. Использование `@at-root` может быть полезным в случаях, когда вы хотите избежать повышения специфичности селектора из-за вложенности. Однако следует быть внимательным и не злоупотреблять использованием этой директивы, поскольку её неправильное использование может привести к непредсказуемым результатам и усложнить поддержку кода.