CSS Webdesign Hintergrundgrafiken

Direkt zum Inhalt Home Kontakt CSS Workshop zurück  weiter

Hintergrundgrafik Kopfbereich

Wie Sie sehen habe ich in der Überschrift, welche im DIV Kopfbereich liegt als Beispiel eine Grafik als Hintergrund eingefügt. Zusätzlich habe ich einen Innenabstand mit padding 5px geschaffen und diesem einen gelben Farbton gegeben:
   background-image: url(images/farbverlauf3.jpg);
   padding: 5px;
   border: 5px solid #FFFF78;  

Hintergrundgrafik für die gesamte Webseite

Ferner lernen Sie hier, wie Sie die Webseite mit einer Hintergrundgrafik versehen können, welche Sie hier links sehen.
background-image: url(images/farbverlauf2.jpg);
Sie können die Grafik im Hintergrund auch zusätzlich:
kacheln: background-repeat: repeat-y; /*vertikal untereinander*/
positionieren: background-position: top left;
fixieren: background-attachment: fixed; /*scrollt nicht mit*/

Die Anleitung orientiert sich an dem Buch little boxes Webseiten gestalten mit CSS Grundlagen.
Von dem Autor sind die nachfolgenden Titel verfügbar:

Nach oben