Importation de fichiers CSS dans des fichiers LESS

Dans LESS, l'importation de feuilles de style externes est une fonctionnalité utile pour organiser et gérer votre code. Cependant, il est essentiel de comprendre les exigences spécifiques lors de l'importation de différents types de fichiers.

Importation de fichiers .css

Contrairement à l'importation d'autres fichiers LESS, l'importation d'un fichier .css dans un fichier LESS nécessite une attention particulière. . Utiliser simplement la directive @import comme d'habitude ne fonctionnera pas.

Syntaxe d'importation de fichiers .css

Pour importer un fichier .css dans un fichier LESS, vous devez utiliser la syntaxe suivante :

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

En spécifiant l'option (css), vous indiquez explicitement au compilateur LESS de traiter le fichier importé comme un fichier CSS. Cela garantira que les styles CSS du fichier .css sont inclus dans votre fichier LESS.

Exemple

Considérez le code suivant :

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

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

Dans cet exemple, le fichier LESS importe le fichier ../style.css, qui contient une classe appelée .type. En spécifiant l'option (css), le compilateur LESS reconnaîtra le fichier importé comme un fichier CSS et rendra la classe .type accessible dans votre fichier LESS.

En suivant cette syntaxe spécifique, vous pouvez importer et utiliser avec succès Fichiers CSS dans votre code LESS, vous permettant de combiner les fonctionnalités des deux frameworks.