Les différences spécifiques entre les méthodes de référence CSS import et link

Nous savons qu'il existe deux manières de référencer du CSS externe dans les pages Web, à savoir : @import et link Nous entendons souvent les gens dire qu'il est préférable d'utiliser un lien pour introduire du CSS, mais savez-vous pourquoi ?

lien


@importer


Pourquoi utiliser @import
La plupart des gens utilisent @import car les anciens navigateurs ne prennent pas en charge @import, ce qui signifie que nous pouvons utiliser @import pour introduire des styles CSS que seuls les navigateurs modernes peuvent analyser.
Utilisez le code suivant pour empêcher les navigateurs IE6 et inférieurs d'analyser le CSS (les méthodes inférieures à IE6 sont en mauvais état et seront omises ici)
Écran @import url(../style.css) ;
Une autre raison principale est que votre page Web doit introduire plusieurs fichiers CSS externes. Vous devez utiliser un lien pour introduire un CSS, puis utiliser la méthode @import pour introduire plusieurs autres fichiers CSS dans ce fichier CSS.

Pourquoi utiliser le lien
L'une des principales raisons d'utiliser la méthode des liens est que vous pouvez permettre aux utilisateurs de changer de style CSS. Les navigateurs modernes tels que Firefox, Opera et Safari prennent tous en charge l'attribut rel="alternate stylesheet" (c'est-à-dire que vous pouvez choisir différents styles). sur le navigateur). Bien sûr, vous pouvez également utiliser Javascript pour permettre à IE de prendre en charge les changements de style des utilisateurs.

Petits problèmes avec @import Si la balise head de votre page web est très simple, avec seulement l'attribut @import. Lorsque l'utilisateur navigue sur une vitesse Internet lente, il verra une page sans styles, et alors le fichier CSS sera. téléchargé. Vous pouvez voir le style approprié. Pour éviter ce problème, vous devez vous assurer qu'il y a au moins une balise de script ou de lien dans l'en-tête.

Quelle méthode faut-il utiliser ? À l'heure actuelle, il semble que pour les petits sites Web, il soit plus approprié (ou plus populaire) d'utiliser le lien. Bien sûr, si nous avons besoin de modulariser le CSS à l'avenir, nous utiliserons certainement @import.

L'article est partiellement traduit de Quelle est la différence entre @import et un lien pour CSS à des fins d'apprentissage, bienvenue pour l'ajouter ?