Cascading Style Sheets (CSS)
Wurde entwickelt um die HTML Tags optisch zu verändern, damit man Internetseiten schöner und individueller Gestalten kann.
Es gibt verschiedene Arten CSS einzubinden
inline
<h1 style=”COLOR: blue;”> Überschrift </h1>
im Dokumentenkopf (HTML <head> </head>
<style> h1{ COLOR: blue; } </style>
separate Datei
<link
rel=”stylesheets”
type=”text/css”
href=”LinkZurDatei”
media=”print and (max-width: 600px)”
>
Was bedeutet CSS?
CSS
Cascading Style Sheets
Welche Möglichkeit gibt es CSS in ein HTML Dokument einzubinden?
CSS in ein HTML Dokument
Inline
Im Dokumentenkopf (Head von HTML)
In separater Datei
Welche Ausgabemedien gibt es?
Ausgabemedien
screen (Standartwert)
tty
tv
projection
handheld
print
braille
embossed
speech
all
Wie lassen sich CSS Dateien Importieren?
CSS Dateien Importieren
Wie lässt sich medien spezifisch designen?
Medien spezifisch designen
Wie lassen sich Print designs erstellen?
Print designs
Wie lassen sich mehrfach Selektoren darstellen?
mehrfach Selektoren
Wie lassen sich Elemente Stylen die nur in einer bestimmten Reihenfolge auftauchen?
Bestimmte Reihenfolge
Durch welchen operator lassen sich alle Elemente Stylen?
Alle Elemente stylen
Wie lässt sich etwas unter einem anderen Element stylen?
Unter anderem Element stylen
Wie lässt sich ein Element nur direkt unter dem anderen Element stylen?
Direkt unter dem Element
Wie lassen sich Elemente stylen mit attributbezogenen Formaten?
Attributbezogene Formate stylen
Wie lassen sich Klassen erstellen?
Klassen erstellen / Normale Klassen
Wie lassen sich Klassen erstellen die nicht an TAGs gebunden sind?
Klassen ohne Tags / Allgemeine Klassen
Wie erstellt man ID Klassen?
ID Klassen
Was sind Pseudo Klassen?
Pseudo Klassen
Sind Klassen um gewisse Tags spezifischer Darzustellen
Welche Pseudo Klassen gibt es für den <a> Tag?
Pseudo Klassen <a> Tag
Nicht besucht
a:link { color: blue; }
In diesem Moment besucht
a:active { color: red; }
Zuvor bereits besucht
a:visited { color: green; }
Beim drüber fahren mit der Maus
a:hover { color: yellow; }
Last changeda year ago
