3.3.2 Separates Stylesheet (external stylesheet)
⇧ 1 Allgemein
Es ist folgendes vorzunehmen
- Erstens ist eine neue Datei für das Stylesheet mit der Endung "css" zu erstellen.
- Zweitens ist ein Verweis im Kopf der HTML-Datei aufzunehmen, der auf das separate Stylesheet verweist.
- Drittens wird dann der entsprechende HTML-Texte nach der Vorgabe im Stylesheet formatiert.
⇧ 2 Vorgehen
- a) Erstens:
Separate CSS-Datei mit der Endung
.csserstellen - b) Zweitens: Verweis im Kopf der HTML-Dokumentes auf das separate Stylesheet
- c) Drittens: Das HTML-Dokument wird im Textbereich wie folgt editiert
↑
a) Erstens: Separate CSS-Datei mit der Endung .css erstellen
Neue Datei mit der Endung ".css" erstellen.
-
Auf dem Desktop mit der rechten Maustaste den Editor aufrufen und ein neues Dokument eröffnen.
-
das Dokument mit der Endung ".css" speichern.
-
Für den Dateinamen sind nur Kleinbuchstaben zu verwenden.
1) Beispiel von einem Inhalt des separaten Stylesheets
h6 {font-size:1em;font-weight:bold; letter-spacing:0.05em;
background:transparent;color:fuchsia;}
↑ b) Zweitens: Verweis im Kopf der HTML-Dokumentes auf das separate Stylesheet
2) Im Kopf des HTML-Dokumentes ist ein Verweis auf das separate Stylesheet
<link rel="stylesheet" type="text/css" href="dateiname.css">
↑ c) Drittens: Das HTML-Dokument wird im Textbereich wie folgt editiert
3) Im Quelltext steht geschrieben
<h6>Dies ist ein Beispiel formatiert als Überschrift 6. Ordnung</h6>
4) Im HTML-Dokument erscheint dann folgendes
Dies ist ein Beispiel formatiert als Überschrift 6. Ordnung
⇧ 3 Grundlagen-Websites & Workshops
-
W3C Specification
CSS2 en A sample style sheet for HTML 4.0 - Alte ausführliche Version
-
W3C Specification
CSS2.1 en A sample style sheet for HTML - Neue kurze Version
en Default style sheet for HTML 4
- Web Design Group en Linking to an External Style Sheet
-
W3Schools
en
CSS Demo
- CSS 4 You de Stylesheets in eine externen Datei auslagern
- The Styleworks de Externe Stylesheets