CSS ist die Abkürzung für Cascading Style Sheets. Anzutreffen in der Webseitenprogrammierung zur Gestalltung von Templates.
Diese deklarative Stylesheet-Sprache wird immer in Verbindung mit HTML oder XML eingesetzt.
Verwendung von CSS
Im Web wird CSS für HTML und XML Dokumente zum strukturieren und designen verwendet. Leider unterstützen bis 2010 noch nicht alle Browser vollständig alle eingeführten Funktionen. Die Sprache ist seit 1996 wird CSS Level 1 im Internet genutzt und bisher von großteils allen Browsern unterstützt. CSS Level 2 ist seit 1998 im Internet verbreitet.
Das nicht alle Browser die CSS 2 unterstützen, bereitet Designern große Schwierigkeiten. Meist werden Browser dann ausgeschlossen oder sogenannte Browserweichen programmiert. Browser wie Mozilla besitzen auch eigene Stylesheet Eigenschaften, was das ganze nochmal etwas komplizierter macht. CSS 3 ist seit 2000 in Aufbau und wird nach und von den einzelnen Browsern unterstützt. Leider sind große Marken immer noch etwas hinter her.
Aufbau / Syntax von CSS
Der Aufbau ist recht einfach gestalltet und auch für Neueinsteiger interessant. Übersichtlich und durchgängig für alle Eigenschaften im gleichen Muster, bietet CSS schnelle optische Fortschritte.
Selektor Name { Eigenschaft : Wert ; Eigenschaft-A : Wert Wert ; }
Der Selektor gibt an, um was für Element es sich handelt.
Ein Punkt ( . ) steht für eine Klasse ( in Html: class="optionaler-name" )
Ein Raute ( # ) steht für eine ID ( in Html: id="optionaler-name" )
Es brauch auch kein Selektor angegeben werden, um direkt HTML-Elemente anzusprechen. Dies sieht dann so aus:
div{ border: 1px solid red; }
Dann gilt der border (Rahmen) für alle <div></div> Elemente.
Das Ende einer Anweisung wird mittels Simikolon ( ; ) deklariert.
Mehrere Wertangaben werden durch Leerzeichen oder Komma getrennt. Wertangaben die ein Lehrzeichen enthalten (Bsp: Times New Roman) werden in Anführungsstriche geschrieben.
Beispiel:
font-family: Tahoma , “Times New Roman , Verdana ;
Aufruf von CSS
- als externe Datei, aufrufbar über den Kopf der HTML Seite (im <head>)
- als interne Anweisung im Kopf der HTML Seite (im <head>)
- direkt in einem Element mittels style-Attribut
Es kann eine externe Datei erstellt werden, die eine .css Endung aufweißt.
CSS kann auch direkt im Kopf (Head) einer Seite aufgerufen werden oder mittels style-Attribut im Element selbst erzeugt werden.
Beispiel: externer Aufruf im <head>
<link rel="stylesheet" type="text/css" href="style.css" />;
<?xml-stylesheet type="text/css" href="style.css" ?>
Beispiel: interne Anweisung im Kopf der Seite
<style type="text/css">
div
{
border: 1px solid red;
}
</style>Beispiel: direkt im Element mittels style-Anweisung
<div style="border: 1px solid red;">Mein roter Rahmen</div>
Marcus alias Speedy86 ist Administrator dieser Webseite und veröffentlicht unter andem News und interessante Artikel rund um WordPress, Suchmaschinenoptimierung, Programmierung und Webdesign. Im Webmaster-Glossar.de gibt es viel wissenswerten Stoff für Webmaster, Webworker bzw. Selbständige im Internet.Artikel:
Bereits 439 Artikel verfasst!