CSS Einführung
Einleitung
Cascading Style Sheets, sind Formatierungsanweisungen, die über die Möglichkeiten von HTML Hypertext Markup Language:
Seitenbeschreibungssprache, mit der man Webseiten schreibt. hinaus gehen. Deshalb wird vom
W3C World Wide Web Consortium:
Zusammenschluß von Interessensgruppen aus Forschung und Wirtschaft, der Empfehlungen und Vorschläge für neue Internet-Standards (z.B. XHTML und CSS) erarbeitet
empfohlen, für die Formatierung einer Website immer CSS zu verwenden.
Mittels CSS ist es möglich, vollkommen auf das veraltete <font> <font>: Veraltetes Element, mit dem man Schriftfarbe, Schriftgröße und Schriftart bestimmen kann.-Tag zu verzichten. Durch Auslagerung der CSS Anweisungen in eine externe Datei ist es möglich alle Dokumente einer Seite mittels einer CSS Datei zu formatieren.
Diesen riesigen Vorteil sollte man sich zu Nutze machen, und CSS lernen. Da CSS von den aktuellen Browser angezeigt wird, kann man diese Technologie ruhig verwenden.
Was benötige ich?
Als erstes benötigt man einen Browser, der CSS unterstützt. Das können alle gängigen neuen Browser. CSS kann man in einem ganz normalen Texteditor codieren, in dem man z.B. auch HTML codiert.
Einbinden von CSS
CSS lässt sich in drei verschiedenen Arten einbinden.
Wenn man CSS als externe Datei einbindet, kommt folgendes in den <head>-Bereich:
<link rel="stylesheet" type="text/css" href="style.css">
In dieser CSS Datei style.css stehen die Stylesheets, z.B. folgendes:
p {font-family: Verdana, Arial, Tahoma, sans-serif; color: #FFFFFF;}
Dazu später mehr.
Wenn man nur einen kleinen Style-Code hat, kann man diesen auch in den Head Bereich des HTML Dokuments schreiben. Diesen bindet man über das <style>-Tag ein:
<style>
<!--
/* Die Style-Anweisungen */
a {font-family: Verdana, Arial, sans-serif; color: black;}
-->
</style>
Die CSS Anweisung kommt immer zwischen HTML Kommentaren. Das hat den Sinn, dass Browser, die kein CSS unterstützen, das Sytle-Tag einfach "überlesen" und ignorieren, damit keine Fehler auftreten.
Ein Kommentar in CSS schreibt man, wie oben zu sehen ist, zwischen /* und */. Das Kommentar kann auch über mehrere Zeilen gehen.
Zu guter Letzt kommt jetzt noch das Einbinden mit dem Attribut style. Das ist ganz einfach:
<a style="color: blue; text-decoration: none;">Link</a>
[-hoch-]
|