Heim >Web-Frontend >HTML-Tutorial >Der Unterschied zwischen Link und @import

Der Unterschied zwischen Link und @import

WBOY
WBOYOriginal
2016-08-15 16:49:531577Durchsuche

Wir alle wissen, dass sowohl Link als auch @import CSS-Stylesheets einführen können. Was ist also der Unterschied zwischen den beiden? Lassen Sie uns zunächst über ihre jeweiligen Link-Methoden sprechen und dann über ihre Unterschiede~~~

So verlinken Sie:

<span style="color: #0000ff;"><</span><span style="color: #800000;">link </span><span style="color: #ff0000;">rel</span><span style="color: #0000ff;">="stylesheet"</span><span style="color: #ff0000;"> type</span><span style="color: #0000ff;">="text/css"</span><span style="color: #ff0000;"> href</span><span style="color: #0000ff;">="index.css"</span><span style="color: #0000ff;">></span>

@import Importmethode:

 <span style="color: #0000ff;"><</span><span style="color: #800000;">style </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="text/css"</span><span style="color: #0000ff;">></span><span style="background-color: #f5f5f5; color: #800000;">
  @import url('index.css');
  </span><span style="color: #0000ff;"></</span><span style="color: #800000;">style</span><span style="color: #0000ff;">></span>

Priorität: Stil einbetten > Stylesheet importieren (Link in Stylesheet)

Die Importmethode ist der Verknüpfungsmethode sehr ähnlich, aber tatsächlich entspricht sie der im internen Stylesheet. Trotzdem ist ihre Priorität immer noch niedriger als die des internen Stylesheets und sie ist dieselbe Als verknüpfter Stil hängt die Priorität der Tabelle von der Reihenfolge der Position ab. Wer später definiert wird, hat eine höhere Priorität .

Hinweis: Beim Importieren eines externen Stylesheets muss sich dessen Position oben im Stylesheet befinden, also vor anderen Stilen .

Sie haben insgesamt 5 Unterschiede (soweit ich weiß, werde ich sie hinzufügen, wenn es in Zukunft neue Entdeckungen gibt).

                                                                                                                                                                                                                                                         .                                                                                            

2: Wenn

Link verweist auf CSS, es wird gleichzeitig mit dem Laden der Seite geladen; @import muss warten, bis die Seite geladen ist vor dem Laden vollständig beladen sein. Drei:

Link ist das XHTML-Label, es gibt kein Kompatibilitätsproblem; für @import wird ein Browser mit niedriger Version nicht unterstützt. Viertens:

LINK unterstützt die Verwendung des JavaScript-Steuerdoms zum Ändern des Stils, während @import dies nicht unterstützt. Fünftens:

@import kann andere Stylesheets wieder in die CSS-Datei einführen.

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn