La différence entre le lien CSS et @import

Il existe trois manières principales d'utiliser CSS sur la page : 1. Ajoutez et définissez la valeur de l'attribut de style en ligne. 2. Appel en ligne dans l'en-tête de la page. 3. Appel de lien externe.

Il existe deux types de références externes : link et @import.

Code XML/HTML

<link href="stylesheet" href="CSS文件" type="text/css"/>

Code XML/HTML

<style type="text/css">
    @import url("CSS文件")
</style>

Les deux sont des moyens de référencer CSS en externe, mais il existe certaines différences :

Différence 1 : le lien est une balise XHTML En plus de charger du CSS, il peut également définir d'autres transactions telles que RSS. ; @ Import appartient à la catégorie CSS et ne peut charger que du CSS.

Différence 2 : Lorsque le lien fait référence à CSS, il est chargé en même temps que la page est chargée ; @import nécessite que la page soit complètement chargée avant le chargement.

Différence 3 : le lien est une balise XHTML, il n'y a donc pas de problème de compatibilité ; @import a été proposé en CSS2.1, et les navigateurs de versions inférieures ne sont pas éligibles.

Différence 4 : le lien prend en charge l'utilisation de Javascript pour contrôler le DOM afin de changer le style alors que @import n'est pas admissible.

Différence 5 : Le style de lien a un poids plus élevé que @import.

Supplément : La meilleure façon d'écrire @import
Il existe généralement les manières suivantes d'écrire @import :

@import 'style.css' // Windows IE4/ Non reconnu par NS4, Mac OS /Windows NS4, Macintosh NS4 ne reconnaît pas
@import url('style.css') //Windows NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4 ne le reconnaît pas reconnaître
@import url("style.css ") //Windows NS4, Macintosh NS4 ne reconnaît pas
D'après l'analyse ci-dessus, nous savons que @import url(style.css) et @import url("style .css") sont les meilleurs choix et sont compatibles avec la plupart des navigateurs. Du point de vue de l'optimisation des octets, @import url(style.css) est le plus recommandé.

Pour plus d'informations sur la différence entre le lien css et @import, veuillez faire attention au site Web PHP chinois pour les articles connexes !