Start > Einleitung > CSS einbinden > CSS-Angaben 1 > CSS-Angaben 2 > Phase5
|
| CSS-Angaben - Teil 2 | ||
|---|---|---|
| Hintergründe (Auszüge) |
|---|
Sie können für HTML-Elemente Hintergrundfarben und -bilder festlegen, sind damit nicht auf den Dateikörper oder Tabellen beschränkt.
| CSS-Angabe | Wert | Bedeutung |
|---|---|---|
background-color |
Farbwert | Hintergrundfarbe |
background-image:url() |
Dateiname oder -pfadangabe | Hintergrundbild |
background-repeat |
repeat, repeat-x,
repeat-y, no-repeat |
Wiederholung |
background-attachment |
scroll, fixed |
Wasserzeicheneffekt |
background-position |
top (obenbündig), center
(zentriert), middle (vertikal mittig), bottom (untenbündig),
left (linksbündig), right (rechtsbündig) |
Position des Hintergrundbilder (z.B. im
Zusammenhang mit background-repeat). |
background-position und background-attachment
werden von Netscape erst ab Version 6.x interpretiert.
| Positionierung (Auszüge) |
|---|
Positionierungen bieten die interessante Möglichkeit, sture Nacheinanderandordnung von HTML-Elemente im Browser aufzubrechen. Sie können die Elemente frei positionieren, z.B. Texte und Bilder übereinander anordnen.
| CSS-Angabe | Wert | Bedeutung |
|---|---|---|
position |
absolut, relativ,
(static, fixed) |
Art der Positionierung zum vorhergehenden Element |
top |
numerischer Wert | Startposition von oben |
left |
numerischer Wert | Startposition von links |
width |
Numerischer Wert | Breite des Elementes |
float |
left (linksbündig), right
(rechtsbündig), none (ohne) |
Umfluss des Elements durch seinen Nachfolger |
clear |
left (*), right
(**), both (unterhalb), none (ohne) |
Fortsetzung nach Textumfluss |
z-index |
natürliche Zahl (***) | Schichtposition |
(*) erzwingt nach float:left Umbruch unterhalb.
(**) erzwingt nach float:right Umbruch unterhalb.
(***) Interessant mit der Angaben zu position. Sie
können Schichten in der Datei festlegen. Bei Positionierungen liegen Schichten
höherer Nummer über Schichten niederer Nummer.
| Weitere CSS-Angaben (Auszüge) |
|---|
Häufig werden auch Pseudo-Formate für Verweise über CSS-Angaben vergeben. a:visited
beschreibt z.B. bereits besuchte Verweise.
| CSS-Angabe | Wert | Bedeutung |
|---|---|---|
a:link |
Text- und Hintergrund:
CSS-Angaben im bisher genannten Format; (*) |
Verweise zu noch nicht besuchten Seiten |
a:visited |
Verweise zu bereits besuchten Seiten | |
a:active |
gerade angeklickte Verweise | |
a:hover |
Verweise, wenn sie mit der Maus überfahren werden | |
a:focus |
Verweise, die den Fokus erhalten, z.B. durch die Tabulatortaste |
(*) a:hover wird von Netscape erst ab Version 6.x
interpretiert.
Anmerkung:
Oft wird die 'HTML-Unterstreichung' von Hyperlinks als störend für das eigene
Layout empfunden. Wollen Sie die Unterstreichung unterdrücken, notieren Sie die
CSS-Angabe:
a { text-decoration:none; [weitere
Angaben] } |
Über Pseudo-Formate können sie den Verweisen dann weitere Eigenschaften zuweisen.
Weitere CSS-Angaben sind möglich. Zu den folgenden Themen werden die Angaben aber noch sehr unterschiedlich oder gar nicht interpretiert, bzw. werden sie sicher in wenigen Fallen benötigt:
| Listen und Tabellen | Seitenlayout, -umbruch | Cursor |
| mehrspaltiger Textfluss | Microsoft-Filter | Sound-Ausgabe |
Ein Service von http://www.hechtnetz.de
Start > Einleitung > CSS einbinden > CSS-Angaben 1 > CSS-Angaben 2 > Phase5