• Apfeltalk ändert einen Teil seiner Allgemeinen Geschäftsbedingungen (AGB), das Löschen von Useraccounts betreffend.
    Näheres könnt Ihr hier nachlesen: AGB-Änderung
  • Viele hassen ihn, manche schwören auf ihn, wir aber möchten unbedingt sehen, welche Bilder Ihr vor Eurem geistigen Auge bzw. vor der Linse Eures iPhone oder iPad sehen könnt, wenn Ihr dieses Wort hört oder lest. Macht mit und beteiligt Euch an unserem Frühjahrsputz ---> Klick

Hintergrundbild height 100%

robbieW

Doppelter Prinzenapfel
Registriert
09.03.09
Beiträge
442
Hallo Kollegen,

ich möchte bei einer Website ein Hintergrundbild einfügen welches im Browser rechts platziert ist nur nur die Höhe 100% einnehmen soll.

Ich bekomme das per css nicht hin.

Siehe Code:

body{
font-size: 14px;
line-height: 140%;
background: #000000 url(../img/bild-beispiel.png) no-repeat right bottom fixed;
color:#dddddd;
}

was muss ich einfügen damit mien Bild sich proportional im Browser immer auf 100% Höhe skaliert?

Danke
 

DubiDuh

Zwiebelapfel
Registriert
20.05.08
Beiträge
1.288
Versuch es mal mit background-size: cover;
 

robbieW

Doppelter Prinzenapfel
Registriert
09.03.09
Beiträge
442
Dann wird es komplett in 100% dargestellt. Ich brauche aber nur height 100%
 

Alexander@MTC

Erdapfel
Registriert
29.09.14
Beiträge
3
Okay, der Beitrag ist zwar nicht mehr ganz aktuell, aber falls es noch interessiert. So geht's:

background-size: 1000px 100vh

1000px Breite ist nur ein Beispielwert. Interessent ist 100vh.
vh steht für Viewport Height. Es gibt auch vw, also Viewport Width.

100vh heißt also, dass das Element, in diesem Fall das Hintergrundbild, die ganze Breite des Bildschirms ausfüllen soll.

Sehr praktisch also, aber nur wenig bekannt.
 
  • Like
Reaktionen: z3ro und MacMac512

Mitglied 189256

Gast
Ich finde vh und vw etwas Problematisch, da es Ur Zeit nur von wenigen Browsern RICHTIG umgesetzt wird.