Importation de fichiers avec LESS
Objectifs
À la fin de cette vidéo, vous serez en mesure de :
- Comprendre l'utilité d'importer des fichiers CSS spécifiques.
- Utiliser la fonction import de LESS pour structurer vos styles CSS.
- Optimiser les performances de chargement des pages web.
Résumé
Découvrez comment LESS permet d'importer des fichiers CSS spécifiques pour une meilleure organisation et des performances optimisées.
Description
Confrontés à des feuilles de style CSS volumineuses, nombreux sont ceux qui rêvent de les diviser selon leur utilité ou les spécifications HTML5. Avec un fichier header.css pour l'entête et un fichier footer.css pour le pied de page, la quantité de code par fichier serait réduite à des niveaux acceptables. Cependant, en pratique, cela est rarement fait pour des raisons de temps de chargement des pages et de performances.
La solution apportée par LESS est révolutionnaire. En permettant l'inclusion de fichiers dans d'autres fichiers grâce à la fonction import, LESS simplifie la gestion et la compilation des feuilles de style en un fichier CSS unique. Cette fonctionnalité est facilement implémentable, comme expliqué dans cette leçon, où vous apprendrez à créer des fichiers individuels tels que header.less et footer.less, puis à les importer dans votre feuille de style principale.
De plus, LESS permet l'importation de fichiers avec de multiples extensions, comme le PHP, et garantit que tout sera compilé proprement en CSS. Découvrez cette méthode innovante pour gérer vos styles CSS de manière efficace et structurée.