@import oder externes Stylesheet

danihue · 21.01.2006, 15:11

Hallo,

ich fange gerade an mich mit css zu beschäftigen.

Kann mir vielleicht jemand erklären wo der Unterschied liegt, ob ich eine Definition als externes Stylesheet oder als importierte Definition einfüge ?

Ich meine im Prinzip handelt es sich doch in beiden Fällen um seperate Dateien die eingebunden werden ... !?

rewboss · 21.01.2006, 15:41

Der Unterschied, grob gesagt, ist folgendes: Ein externes Stylesheet wird mit dem HTML-<link>-Tag verlinkt: @import ist ein CSS-Befehl.

Ein externes Stylesheet kann also andere Stylesheets importieren.

danihue · 21.01.2006, 15:56

Sorry, aber das verstehe ich noch nicht so ganz ... wenn ich eine css Datei habe, dann ist es doch egal ob ich diese nun importiere oder über "link" ... einfüge ... oder nicht ?

steff11 · 21.01.2006, 16:10

Grundsätzlich leisten beide Varianten das gleich: @import ist html-Syntax, die "link"-Variante ist css-Syntax. selfhtml weist noch darauf hin: Der Internet Explorer unterstützt die Einbindung über @import in Verbindung mit der Angabe von Ausgabemedien nicht.

Ich seh also eigentlich keinen Grund, die @import-Methode zu verwenden. Lieg ich da falsch?

Thomas · 21.01.2006, 18:00

Zitat:

Zitat von steff11

Ich seh also eigentlich keinen Grund, die @import-Methode zu verwenden. Lieg ich da falsch?

grundsätzlich liegst du da richtig.

man kann sich aber die @import-Methode zu Nutze machen (weil alte Browser sie gar nicht verstehen), darüber bestimmte css-Anweisungen vor den alten Browsern zu "verstecken"

also alle "unproblematischen" css-sachen "normal" per link-Tag reinhängen, für alte Browser problematische Anweisungen per @import

rewboss · 21.01.2006, 18:34

Zitat:

Zitat von steff11

@import ist html-Syntax, die "link"-Variante ist css-Syntax.

Andersrum.

Theoretisch wäre sowas möglich: Im HTML:

Code:

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

In der Datei css1.css dann:

Code:

@import url("/css2.css");

Einen <link>-Tag kann man nicht in eine CSS-Datei einbauen.

steff11 · 21.01.2006, 19:34

Zitat:

Zitat von rewboss

Andersrum.

Du hast recht (wie so oft).

danihue · 22.01.2006, 18:38

@Thomas also das habe ich glaube ich soweit verstanden

"link" ist eben ein HTML Befehl, mit dem auf das Stylesheet xy.css verwiesen wird

"@import" ist der CSS Befehl, mit dem auf diese Datei verwiesen wird, @import gehört in die Style Deklaration und wird daher evtl von älteren Browsern nicht erkannt

Ich hoffe das ist so korrekt

@rewboss wo soll da der Sinn drin liegen ??

321 · 22.01.2006, 19:17

oder so:

HTML-Code:

<head>
<style type="text/css">
@import url(druck.css) print, embossed;
</style>
</head>

aber mit <link> geht es ja immer!

rewboss · 22.01.2006, 22:15

Zitat:

Zitat von danihue

@rewboss wo soll da der Sinn drin liegen ??

Nun ja... da nicht alle Browser, wie erwähnt, @import verstehen, kann man mit einigen Tricks bestimmte CSS-Regeln für bestimmte (ältere) Browser unsichtbar machen.

Sonst ist das halt eine Alternative zum normalen <link>-Tag.