Hi,
Ich programmiere gerade meine erste Seite und habe für das Design ein externes CSS-Script geschrieben. Dort habe ich ein Hintergrundbild per background-image: url(xxxxx.jpg); gesetzt, jetzt hat das ja aber eine bestimmte Größe, ich will aber, dass es im Browser komplett angezeigt wird, ohne repeat, da ich auch background-attachement:fixed; eingestellt habe, so dass der Hintergrund nicht mit gescrollt wird. Es soll also praktisch das Browserfenster, egal welche Auflösung der Rechner hat und wie groß das Display ist, komplett ausfüllen und sich an displaygrößes selbstständig anpassen. Hoffe ihr könnt mir dabei weiterhelfen.

mit freundlichen Grüßen,

Cuba99

CSS2 bietet dort keine Möglichkeit für. Mit CSS3 wird es background-size geben, weiß nicht ob und in wie weit die einzelnen Browser es unterstützen: klick.

Aber du weißt schon, dass das Bild nicht "schöner" wird, wenn der Browser es vergrößert? Ich würd ein extra großes Bild für den Hintergrund nehmen und dies mittig zentrieren.

__________________

danke erstmal für deine antwort naja, dann wird das bild aber beid en kleineren bildschirmen einfach abgeschnitten oder? wäre nämlich nicht ganz so toll :P

Die Alternative, dass es bei einer Vergrößerung Pixelig wird auch nicht.

__________________

Hallo

Es gibt da einige Lösungen. Aber natürlich mit den o.g. Kompromissen in der Bildqualität.

How To: Resizeable Background Image | CSS-Tricks
SCALE BACKGROUND
(aus diesem Artikel: Hintergrundbilder eindrucksvoll mit CSS skalieren | CSS, Hintergrundmuster | Dr. Web Magazin)
stu nicholls | CSS PLaY | 100% wide/high 'background' image emulation

Gruß Manfred

also ich hätt jetzt ne lösung, die mir allerdings noch nicht zu 100% gefällt.
im html text habe ich folgendes stehen:

<div>
<img id="background" src="V8-Vantage.jpg" alt="" title="" />
</div>

und im css text das hier:

#background
{
position:absolute;
z-index:1;
width:100%;
height:100%;
}

Meine Probleme: ich will, dass dieses src=… verschwindet und ich das in den css text einbinden kann, so dass das bild vom css vorgegeben wird. und außerdem wäre es nett, wenn mir mal jemand erklären könnte, wie das mit divs übereinandersetzen funktioniert, irgendwo habe ich was von einem elterndiv gelesen, keine ahnung wie das gemeint ist, ein code wäre echt klasse

mfg,
Cuba99

Per CSS kann man ein Bild nur als Background-Image einbinden (dies lässt sich ja nicht so vergrößern, wie du es wolltest), du wirst also nicht um das src-Attribut rum kommen, wenn du einen Img-Tag nutzt.

__________________

dann würd ich gern einfach eins nehmen, das groß genug ist für jedes display. aber kann man da dann irgendeine einstellung treffen, dass das bild zumindest verkleinert wird, wenn es größer ist, als das fenster, oder dass es sich eben an die bildschirmmaße irgendwie anpasst oder so?

mfg,
Cuba99

Mal kurz gefasst, Bilder per CSS eingebunden haben immer ein festes Maß, welches durch das Bild selbst bestimmt wird. Bilder per Img-Tag eingebunden lassen sich beliebig verkleinern/-größern, da die Maße dort durch Formatierung des Img-Tags bestimmt werden.

__________________