Einbindung von CSS
In diesem Tutorial geht es um die Einbindung von CSS (Cascading Style Sheets) in ein HTML-Dokument.
Um CSS in HTML einzubinden gibt es drei verschiedene Möglichkeiten. Diese wollen wir jetzt nacheinander erklären.
Einbindung im - Bereich
Formatierungen können im - Bereich zentral definiert und mehrfach verwendet werden. Das geschieht durch
den folgenden Code der im ... - Bereich eingebunden werden muss:
<html>
<head>
<style type="text/css">
<!--
.rot {
color: red;
}
-->
</style>
</head>
<body>
<span class="rot">rote Schrift</span>
</body>
</html>
Im Beispiel wird die Klasse mit dem Namen "rot" im CSS-Teil definiert und später dann verwendet.
externe Datei einbinden
Um Formatierungen zentral verwalten zu können und nicht jedes Dokument bei Designveränderungen anpassen zu müssen, kann man Cascading Style Sheets auch zentral in eine externe Datei schreiben. Diese Datei muss die Endung "css" haben.
Der Inhalt der Datei könnte so aussehen:
.rot {
color: red;
}
Um diese Datei dann in die jeweiligen HTML-Dokumente einzubinden, benötigen wir, wiederrum im - Bereich der Seite, folgenden Code:
<link rel="stylesheet" href="css/design.css" type="text/css">
In diesem Falle läge unsere Datei mit dem Namen "design" und der Endung "css" im Unterordner "css".
Veränderungen an den Formatierungen können nun zentral in dieser Datei erfolgen und sind somit in allen HTML-Dokumenten, wo die Datei eingebunden wird, verfügbar.
Stylesheets in den Tags verwenden
Die einfachste Möglichkeit bestimmte Teile, die nur ein einziges Mal innerhalb eines Projektes speziell formatiert
werden sollen, zu verändern, ist die Einbindung von Stylesheets in dem jeweiligen Tag. Ein Beispiel:
<span style="color: red; font-size: 12px;">roter Text in Größe 12 Pixel</span>
Hier wird der Tag "< span >" mit einer roten Schriftfarbe und einer 12 Pixel großen Schrift formatiert.
Leser-Kommentare
xEiHPx payeierqdmto, [url=http://dsfxdybongpu.com/]dsfxdybongpu[/url], [link=http://toqzjxxbsbzi.com/]toqzjxxbsbzi[/link], http://vnefruthdqnc.com/
geschrieben am 19. Dezember 2010 um 15:24 Uhr
Vmkl1T euktnddspkbh, [url=http://nmxtdfdahgqa.com/]nmxtdfdahgqa[/url], [link=http://plkwgzbvrnal.com/]plkwgzbvrnal[/link], http://tfwqnmezmduu.com/
geschrieben am 06. April 2010 um 06:24 Uhr
jSaRtW gxrcwhhvetog, [url=http://rywkofiwgfbc.com/]rywkofiwgfbc[/url], [link=http://iptmmnfxkeih.com/]iptmmnfxkeih[/link], http://qfgfkawwvevk.com/
geschrieben am 21. Februar 2010 um 10:55 Uhr
P9Gz6q uocblyyqhudp, [url=http://nucgiutpeyvs.com/]nucgiutpeyvs[/url], [link=http://jldkedicjgbu.com/]jldkedicjgbu[/link], http://jjgtearjwhkj.com/
geschrieben am 15. Januar 2010 um 07:22 Uhr
| 
Seitenanfang