Was sind interne Stylesheets?
Interne Stylesheets sind Stile, die im HTML-Dokument platziert werden. Diese Stile wirken sich nur auf das Dokument aus, in dem sie sich befinden, und können von keinem anderen Webdokument referenziert werden.
Vorteile interner Style Sheets
- Interne Stylesheets wirken sich nur auf die Seite aus, auf der sie sich befinden.
- Wenn Sie an einer großen Site arbeiten und Stile testen müssen, bevor Sie sie in die Site als Ganzes laden, können interne Stylesheets ein hervorragendes Werkzeug sein. Mit ihnen können Sie die Stile im Kontext der gesamten Site testen, ohne eine andere als die von Ihnen getestete Seite zu beschädigen.
- Interne Stylesheets können Klassen und IDs verwenden.
- Im Gegensatz zu Inline-Styles können interne Stylesheets Klassen, IDs, Geschwister und andere Elementbeziehungen weiterhin nutzen.
- Interne Stylesheets erfordern nicht das Hochladen mehrerer Dateien.
- Dies ist besonders nützlich, wenn Sie mit E-Mails oder Kiosken arbeiten, für die nur eine HTML-Datei zum Bearbeiten verfügbar ist. Ich verwende häufig Inline-Stile, wenn ich nicht sicher bin, wie die URL aus einem in ein CMS geladenen Stylesheet besteht.
- Interne Stile haben möglicherweise eine höhere Priorität als externe Stylesheets.
- Dies wird durch die Reihenfolge bestimmt, in der die externen Stylesheets geladen werden. Der Webentwickler der Seite kontrolliert, wo die internen Stile im Kopf des Dokuments platziert werden. Wenn sie nach der Verknüpfung mit externen Styles platziert werden, haben sie in der Kaskade eine höhere Priorität und überschreiben das externe Stylesheet.
Nachteile interner Stylesheets
- Sie betreffen nur die Seite, auf der sie sich befinden.
- Wenn Sie dieselben Stile in mehreren Dokumenten verwenden möchten, müssen Sie sie für jede Seite wiederholen (oder einen Link zu einem externen Stylesheet erstellen).
- Interne Stylesheets erhöhen die Ladezeiten der Seite.
- Jede Seite, die über ein internes Stylesheet verfügt, muss die Stylesheet-Informationen jedes Mal laden und analysieren, wenn die Seite geladen wird. Externe Stylesheets werden von Browsern zwischengespeichert. Dadurch werden die Ladezeiten für jede Seite nach dem Laden der ersten Seite verbessert.
So schreiben Sie ein internes Stylesheet
Element:
- Öffnen Sie ein HTML-Dokument in Ihrem Web-Editor.
- Fügen Sie folgendes in das
Ein vollständiges internes Stylesheet würde folgendermaßen aussehen: