• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Hintergrundbild soll 100% des Bildschirmes ausschöpfen

xark

Neues Mitglied
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:
<html>
<Head>
<title>Name</title>
<style type="text/css">
div.bg {
background-image: url("Football.jpg");
width:100%;height:100%;
}
</style>
</head>


<body>

<div class="bg"></div>
<br>
<br>
<br>
<br>
<br>
<br>
Ganz viel Text...
<br>
</H4>
<br>
<H2 align="center">Bitte loggen sie sich ein!</h2>

<Form>



<h4 align="center">Name <input type="text" name="User"><br></h4>
<h4 align="center">Passwort <input type="password" name="PW"><br></h4>
<h4 align="center"><input type="submit" value="Login"></h4>

<H6 align="center">Zum ersten mal hier?<br> Hier können sie sich <A href="www.kommt noch hier hin.de">anmelden</A>!</h6>
</form>
</body>
</html>

Vielen Dank für Eure Antworten!
 
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 <html> und <body> per css, und und legst deinen wrapper ebenfalls absolut darüber

EDIT: da war der prm mal wieder schneller :P
 
Zurück
Oben