Explication détaillée des différences entre href et src, link et @import en css

Cet article présente principalement les différences entre href et src, link et @import, et explique les définitions des noms et les scénarios d'application. Les amis dans le besoin peuvent s'y référer. J'espère que cela pourra aider tout le monde.

La différence entre href et src :

href (Hypertext Reference) : Référence hypertexte, les balises couramment utilisées sont link, a, etc., sont utilisés pour lier des ressources externes référencées. Définir un lien ou une relation entre l'élément actuel ou le document actuel et l'ancre ou la ressource requise définie par l'attribut actuel, tel que :
<link href="style.css" rel="stylesheet" />

src(source) : introduire les ressources, introduit Le contenu de src est une partie essentielle de la page. Le contenu importé intégrera la ressource actuelle dans la position définie par l'élément de document actuel. Les éléments couramment utilisés incluent : img, script, iframe, etc. Par exemple :
<script src="script.js"></script>

Le chargement et le traitement de la page seront suspendus avant que le navigateur télécharge, compile et exécute ce fichier (lorsque le navigateur analyse cet élément, le rendu du navigateur sera mis en pause ), c'est pourquoi il est recommandé de charger le fichier js en bas. La balise img est similaire, le navigateur suspendant le chargement jusqu'à ce que l'image soit récupérée et chargée.

La différence entre link et @import :

Les deux sont des moyens de référencer CSS en externe, mais les différences sont comme suit :

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 que définir. charger CSS.

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

Différence 3 : le lien est une balise XHTML et ne présente aucun problème de compatibilité ; @import a été proposé en CSS2.1 et n'est pas supporté par les navigateurs de versions inférieures.

Différence 4 : le lien prend en charge l'utilisation de JavaScript pour contrôler le DOM afin de changer le style tandis que @import ne le prend pas en charge.

Recommandations associées :

Explication détaillée de la différence entre le nième-enfant et le nième-de-type en CSS3

Explication détaillée de la différence entre addEventListener et on

Quelle est la différence entre br, p et DIV en html

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!