Hintergrundbild soll 100% des Bildschirmes ausschöpfen

html.de-Forum HTML, XHTML & CSS
1

Halo zusammen.

Ich habe ein Problem und zwar versuche ich ein Bild als Hintergrund zu wählen.
Es klappt auch, aber es werden mehrere Bilder und nicht ein einziges auf die ganze Seite ausgedehnt.

Ich habe schon viele gute Beiträge gefunden und viel rumprobiert, aber ich kriege es nicht hin. Habe gestern damit angefangen und es ist für mich noch alles komplettes Neuland.
Tut mir also leid, falls ich den hundertsten Beitrag zu diesem Thema aufmache :\

Im Moment sieht es so aus, das man den Text, der auf der Seite stehen soll nicht mehr sehen kann. Ich weiß nicht ob es daran liegt, dass vielleicht das Bild darüber liegt?!
Das Bild kann man wie gesagt sehen, aber es ist nicht ausgedehnt und wiederholt sich.

Hier der Code:

Name div.bg { background-image: url("Football.jpg"); width:100%;height:100%; }






Ganz viel Text...

Bitte loggen sie sich ein!

Name

Passwort

Zum ersten mal hier?
Hier können sie sich anmelden!

Vielen Dank für Eure Antworten!

2

Bildschirmfüllende Hintergrundgrafik

3

background-attachements können (noch) nicht skaliert werden.
du hast daher nur zwei möglichkeiten.
die hintergrundgrafik so zu erstellen, dass sie groß genug für alle denkbaren viewports ist, bzw der übergang von hintergrundgrafik zu hintergrundfarbe fließend ist.
oder du positionierst deine hintergrundgrafik als img-element absolut, skalierst sie auf 100% x 100%, bei entsprechender formatierung von und per css, und und legst deinen wrapper ebenfalls absolut darüber

EDIT: da war der prm mal wieder schneller :stuck_out_tongue:

4

ich hab den anderen link nicht gelesen aber zum (nicht-)wiederholen:
CSS background-repeat property
besonders da wo in der tabelle

no-repeat The background-image will not be repeated

steht

5

Hab es hinbekommen!
Vielen Dank, habt mir sehr geholfen!