Ein Hintergrundbild in html?

3 Antworten

Erzesel
Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer
Computer
14.02.2020, 20:56

Statt mit der bisher Angesprochenen style Angabe, arbeite mit CSS.

https://www.w3schools.com/cssref/css3_pr_background-size.asp

Ich bevorzuge :

<style>
body {
  background-image: url("Mein.jpg"), url("http://blahundBlubb.net/Alternative.jpg");
  background-size: cover;
  background-color: #cccccc;
}
</style>

Cover füllt immer den gesamten Hintergrund. Bildteile welche nicht mit dem Format der Seite übereinstimmen werden abgeschnitten.

Contain passt immer komplett in das Format. Nicht fühlende Breite/Höhe wird durch Balken in background-color ergänzt.

Jogi1111
14.02.2020, 19:10

<body style="background-image:url(meinbild.jpg)">

Gruß Jogi1111
Lucas557 
Fragesteller
 14.02.2020, 19:11

Dankeschön ;D

1
Lucas557 
Fragesteller
 14.02.2020, 19:37

Jetzt hab ich das Problem das, dass Bild nicht im Vollbild ist.

0
Jogi1111  14.02.2020, 20:25
@Lucas557

Vernünftig geht das dann nur mit CSS:

background-size: cover;
backgroud-size: contain;
background-size: auto auto;

Je nach dem, wie Du es haben willst.

Gruß Jogi1111

1
regex9  15.02.2020, 00:57
@Jogi1111

Da du das so explizit herausstellst und um Missverständnisse zu vermeiden: Der Wert des style-Attributs beinhaltet CSS. Dieses ist lediglich über eine andere Schnittstelle eingebunden, als wenn du den style-Tag verwenden würdest. Daher funktioniert folgendes auch:

<body style="background-image: url('meinbild.jpg'); background-size: cover">
1