CSS 파일을 LESS 파일로 가져오기

LESS에서 외부 스타일시트 가져오기는 코드를 구성하고 유지 관리하는 데 유용한 기능입니다. 그러나 다양한 파일 형식을 가져올 때는 특정 요구 사항을 이해하는 것이 중요합니다.

.css 파일 가져오기

다른 LESS 파일 가져오기와 달리 .css 파일을 LESS 파일로 가져오려면 특별한 고려 사항이 필요합니다. . 평소처럼 @import 지시문을 사용하면 작동하지 않습니다.

.css 파일 가져오기 구문

.css 파일을 LESS 파일로 가져오려면 다음 구문을 사용해야 합니다.

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

(css) 옵션을 지정하면 가져온 파일을 CSS 파일로 처리하도록 LESS 컴파일러에 명시적으로 지시할 수 있습니다. 이렇게 하면 .css 파일 내의 CSS 스타일이 LESS 파일에 포함됩니다.

예

다음 코드를 고려하세요.

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

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

이 예에서 LESS 파일은 .type이라는 클래스가 포함된 ../style.css 파일을 가져옵니다. (css) 옵션을 지정하면 LESS 컴파일러는 가져온 파일을 CSS 파일로 인식하고 LESS 파일 내에서 .type 클래스에 액세스할 수 있게 만듭니다.

이 특정 구문을 따르면 성공적으로 가져오고 활용할 수 있습니다. LESS 코드의 CSS 파일을 사용하면 두 프레임워크의 기능을 결합할 수 있습니다.