Импорт файлов CSS в файлы LESS

В LESS импорт внешних таблиц стилей — это полезная функция для организации и поддержки вашего кода. Однако важно понимать конкретные требования при импорте файлов различных типов.

Импорт файлов .css

В отличие от импорта других файлов LESS, импорт файла .css в файл LESS требует особого внимания. . Простое использование директивы @import, как обычно, не будет работать.

Синтаксис для импорта файлов .css

Чтобы импортировать файл .css в файл LESS, вам необходимо использовать следующий синтаксис:

@import (css) "path/to/style.css";

Указывая опцию (css), вы явно указываете компилятору LESS обрабатывать импортированный файл как файл CSS. Это обеспечит включение стилей CSS из файла .css в ваш файл LESS.

Пример

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

@import (css) "../style.css";

.small {
  font-size: 60%;
  .type;
}

В этом примере файл LESS импортирует файл ../style.css, который содержит класс с именем .type. Указав опцию (css), компилятор LESS распознает импортированный файл как файл CSS и сделает класс .type доступным в вашем файле LESS.

Следуя этому конкретному синтаксису, вы можете успешно импортировать и использовать CSS-файлы в вашем коде LESS, что позволяет объединить функциональность обеих платформ.