Hintergrundbild festsetzen und positionieren

von **CoolCasimir** am 15.01.2005, 18:19

Um ein Hintergrundbild einer Webseite festzusetzen, benötigt man stylesheets.
Hier mal eine Demonstration wie soetwas aussehen könnte:
Einfach oben in den Header hinein.

Code: Alles auswählen: <style> background-image: url(bild.jpg); background-repeat: no-repeat; background-attachment:scroll; background-position: 10px 10px; </style>

Ich denke der Quelltext erklärt sich fast von selbst.
1.) Das Bild angeben
2.) Es soll sich nicht wiederholen
3.) Es ist festgesetzt, also scrollt nicht mit dem Text
4.) Die Position von oben links gesehen in Pixel.

von **miezmutz** am 29.01.2005, 00:59

so einfach kann's gehen...

von **GrayGhost** am 15.02.2005, 17:39

Hallo,
es geht noch leichter. So habe ich es auf meiner HP gemacht:

<style type="text/css">
body { background: #FaFaFa url(World_logo.gif) center no-repeat}
</style>

von **CoolCasimir** am 15.02.2005, 18:26

Viele Wege führen nach Rom..

von **BlackVelvet** am 30.05.2005, 12:11

und warum funzt dat bei mir nich??? :cry:

von **CoolCasimir** am 30.05.2005, 15:49

Doch, das funzt... schau mal hier: http://www.informationsarchiv.net/foren ... 20138.html

von **tuxianer** am 22.04.2006, 13:41

ich habs jetzt rausgefunden!

ihr macht euch das alles viel zu kompliziert!

So funktioniert's:

Code: Alles auswählen: <body background="bg.gif" style="background-attachment:fixed;">

PS: das stylesheet "background-repeat" gibt es nicht

von **dvdabo** am 02.06.2006, 13:18

mal auch meinen senf dazugeb:

<style type="text/css">
body {

background-image:url('hintergrund.JPG');background-attachment:fixed; background-repeat:no-repeat; padding:0px; background-position:top center; }

</style>

meien lösung..

und das css gibts wohl

von **123timbo** am 19.09.2006, 18:11

jetzt ich

style="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); background-image: url(file:///D:/TimBO/homepage/hintergrund.JPG);"

von **a2p** am 19.09.2006, 18:39

darf ich vllt noch anmerken: timbo, wenn du die seite hochlädst siehst nur du den hintergrund. da darf nur homepage.jpg stehen. du hast nen statischen link angegeben. alle browser suchen das bild auf deiner festplatte, und deine besucher haben halt mal nicht deine festplatte.

dann noch zu CoolCassimir:

du hast

3.) Es ist festgesetzt, also scrollt nicht mit dem Text

geschrieben, aber

Code: Alles auswählen: background-attachment:scroll;

geschrieben. mit "scroll" scrollt der hintergrund mit dem text. du musst "fixed" verwenden

Code: Alles auswählen: <style type="text/css">  </style>

Die Datei "background.png" wird einmal angezeigt (no-repeat = keine wiederholung), fix angezeigt (fixed = feste position) und rechts oben angeheftet (right top). die farbe #008800 wird angezeigt, wenn die datei "background.png" nicht existiert oder erscheint da, wo das bild transparent ist.

Code: Alles auswählen: <style type="text/css">  </style>

das bild wird an der x-achse wiederholt und scrollt mit dem text und wird 5% von links nach rechts und 5 % von oben nach unten positioniert.

von **123timbo** am 19.09.2006, 18:57

statischen link angegeben

sorry! das ist wohl richtig!

das kommt aber daher, dass alle dateien relativ zur seitenurl stehen.

das heißt, dass alle homepage dateien auf meiner festplatte, sowie auf dem server gleich angeordnet sind!

TimBO

von **a2p** am 19.09.2006, 20:25

frontpage? dreamweaver? auf jeden fall wysiwyg

von **tuxianer** am 22.09.2006, 19:04

is das jetz in steinalte threads neu aufzurollen?

von **RedPapaBull** am 03.06.2007, 11:25

Also irgenwie funktioniert das bei mir nicht:

Code: Alles auswählen: <style type="text/css"> body { background: #FaFaFa url(back.jpg) center no-repeat width 100%} </style>

Auf meinem Rechner funktioniert es zwar aber auch nicht ganz, da habe ich links und rechts einen Weißen Rand und auf dem Server sehe ich nur eine leere Seite.
Oder habe ich irgenwas falsch gemacht?

von **dragonl** am 03.06.2007, 12:28

RedPapaBull hat geschrieben:Oder habe ich irgendwas falsch gemacht ?

Jup, hast du ^^
Schau dir mal das hier an: http://www.css4you.de/background.html.
Du hast 1. deine Eigenschaften in der falschen Reihenfolge angegeben und
2. versucht es mit weiteren Eigenschaften zu erweitern.

Probiere mal:

Code: Alles auswählen: <style type="text/css"> body{ background: #FaFaFa url(back.jpg) scroll no-repeat center; width: 100%; } </style>

Ich persönlich habe es lieber wenn ich die Eigenschaften einzelnd angebe, so wie in dem Statpost.

MfG
Dragonl

Hintergrundbild festsetzen und positionieren

Hintergrundbild festsetzen und positionieren

ich auch

script

Ähnliche Themen

Wer ist online?