將 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 文件中可存取。

透過遵循此特定語法，您可以成功匯入和使用LESS 程式碼中的 CSS 文件，讓您結合兩個框架的功能。