Was ist der Unterschied zwischen CSS-Link und Import?

Unterschied: Link ist ein HTML-Tag und @import ist eine von CSS bereitgestellte Methode. Das Link-Tag kann nicht nur CSS einführen, sondern auch andere Dinge tun, während @import nur CSS einführen kann und höher; Es gibt kein Kompatibilitätsproblem mit dem Link-Tag.

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

Es gibt zwei Möglichkeiten, externes CSS in HTML einzuführen: Link-Tag und @import. Was ist also der Unterschied zwischen ihnen?

1. Unterschied in der Abhängigkeitsbeziehung

@import ist die von CSS bereitgestellte Syntaxregel, die nur die Funktion zum Importieren von Stylesheets hat; Link ist das von HTML bereitgestellte Tag, das nicht nur CSS-Dateien laden kann, sondern auch Definieren Sie RSS, relative Verbindungsattribute usw.

2. Unterschied in der Ladereihenfolge

Beim Laden der Seite wird das durch das Link-Tag eingeführte CSS gleichzeitig geladen; das durch @import eingeführte CSS wird nach dem Laden der Seite geladen.

3. Kompatibilitätsunterschied

@import ist eine Syntax, die nur in CSS2.1 verfügbar ist, daher kann das Link-Tag nur in IE5+ erkannt werden; es gibt keine Kompatibilitätsprobleme.

4. Der Unterschied in der DOM-Steuerbarkeit

Sie können DOM über JS bedienen und Link-Tags einfügen, um den Stil zu ändern. Da die DOM-Methode auf Dokumenten basiert, können Sie @import nicht zum Einfügen von Stilen verwenden.

【Empfohlenes Tutorial: CSS-Video-Tutorial】

Zusätzliche Erklärung:

@Import-Schreibmethode

<style type="text/css">
    @import &#39;style.css&#39; //Windows IE4/ NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不识别
    @import "style.css" //Windows IE4/ NS4, Macintosh IE4/NS4不识别
    @import url(style.css) //Windows NS4, Macintosh NS4不识别
    @import url(&#39;style.css&#39;) //Windows NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不识别
    @import url("style.css") //Windows NS4, Macintosh NS4不识别
</style>

Unter ihnen @import url(style.css) und @import url("style.css") Es ist die beste Wahl und mit den meisten Browsern kompatibel. Aus Sicht der Byte-Optimierung wird @import url(style.css) am meisten empfohlen.

So schreibt man einen Link

<link href="style.css" rel="stylesheet" type="text/css">

Darüber hinaus hat der Link noch andere Verwendungszwecke, z. B. die Einführung von Symbolen

<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />

Im Allgemeinen gilt: Link ist besser als @import. Es wird dringend empfohlen, den Link-Tag zu verwenden und die @import-Methode zu verwenden Vorsicht.

Weitere Kenntnisse zum Thema Programmierung finden Sie unter: Programmiervideos! !

Das obige ist der detaillierte Inhalt vonWas ist der Unterschied zwischen CSS-Link und Import?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!