# Вложенный импорт в SASS

Обычно `@import` используют вначале документа, но препроцессор SASS позволяет импортировать файлы в любые части нужного нам файла, в том числе и внутрь селекторов.

Рассмотрим следующий пример:

`.active { color: blue; }`

Далее импортируем его в файл `style.scss`:

`div { @import "main"; }`

Теперь посмотрим на результат компиляции:

`div .active { color: blue; }`

Создайте файл `navbar.scss` со следующим содержимым:

`.link { color: red; font-size: 12px; }`

Затем ипортируйте данный фрагмент в блок `#main` файла `styles.scss` и проведите компиляцию в `styles.css`.

← →
↑