3x bewertet

Hintergrund

von Delite  |  07.04.2007 um 11:42 h
CSS Grundlagen
Typ: CSS Grundlagen
Stufe:Einfach Mittelmäßig
Zu erst einmal die einfachste Möglichkeit. Eine Hintergrundfarbe:

background-color:blue

Jetzt ist der Hintergrund blau.

Jetzt hat man vielleicht ein schönes Hintergrund-Bild:

background-image:url(bild.gif)

bild.gif ist hierbei unser Hintergrund-Bild. Jetzt wollen wir, dass sich der Hintergrund nicht wiederholt:

background-image:url(bild.gif);
background-repeat:no-repeat;


Das kann man auch noch anders machen.


background-image:url(bild.gif);
background-repeat:repeat-x;


Jetzt wiederholt sich der Hintergrund nur waagerecht. Das Gegenstück ist:

background-image:url(bild.gif);
background-repeat:repeat-y;


Jetzt kann man auch noch bestimmen wo der Hintergrund sein soll. Oben unten oder so.

background-image:url(bild.gif);
background-repeat:no-repeat;
background-position:top;


top=oben
bottom=unten
right=rechts
left=links

Manchmal möchte man auch nicht, dass der Background auch beim Scrollen gleich bleibt das geht so:

background-image:url(bild.gif);
background-attachment:fixed;


Man kann natürlich auch color und image in einem Code haben.

background-image:url(bild.gif);
background-color:white;


Ich hoffe ich konnte wieder etwas gutes tun



1 Kommentare




neontrauma

Das Ganze kann man auch verkürzt in einer einzigen Zeile notieren:

background: #fff url(bild.gif) fixed no-repeat top;
am 08.02.2008 um 15:01 Uhr