Hintergrundbild + Bilder einfügen

[vanessa]

Hey Leute,
ich versuche gerade, einen Hintergrund sowie generell Bilder in meine Homepage einzufügen. ich habe die Bilddateien (gif und jpeg) im gleichen Ordner wie die Websites und versuche z.B. ein Bild mit <img src="Bild.gif"> einzufügen. Dann entsteht aber nur ein kleines schwarzes x.

Den Hintergrund wollte ich mit background-image:url(Bild.gif) einfügen. Aber wenn ich mir dann im Internet Explorer das Endergebnis anschauen möchte, habe ich einen komplett leeren weißen Bildschirm.

Ich habe es auch schon mit kleineren Bildern versucht, weil ich gelesen habe, dass die Bilddateien durchaus zu groß sein können.Aber es geht einfach nicht.
Weiß vielleicht jemand, wo mein Fehler liegen könnte oder wie es richtig funktioniert?Ich würde mich sehr darüber freuen.
Lieben Gruß
Vanessa

[Stahl Florian]

Hallo

bei <img src="bild.gif">

Vielleicht irgendwas verwechselt:

• gross oder klein schreiben
• jpg oder gif richtig schreiben

[Der Martin]

Hallo,

[...] und versuche z.B. ein Bild mit <img src="Bild.gif"> einzufügen. Dann entsteht aber nur ein kleines schwarzes x.

zunächst mal hast du noch einen kleinen Formfehler: Das img-Tag _muss_ nach der MTML-Spezifikation ein alt-Attribut haben, also
<img src="bild-url" alt="Alternativer Text">
Aber das nur am Rande, das ist hier nicht dein Problem.

Die Bilder und die HTML-Datei liegen wirklich im gleichen Verzeichnis auf dem Server?
Dann achte mal genau auf die Groß/Kleinschreibung beim Dateinamen. Die meisten Server unterscheiden das nämlich sehr genau, so dass z.B. <img src="bild.jpg"> nichts findet, wenn die Datei in Wirklichkeit bild.JPG heißt.

Den Hintergrund wollte ich mit background-image:url(Bild.gif) einfügen.

Ups. Richtige Anweisung, aber im falschen Kontext.
background-image:url(...) ist völlig okay, aber es ist kein HTML, sondern eine CSS-Definition. Sie gehört also ins Stylesheet in das Ruleset des Elements, das du mit dem Hintergrund ausstatten willst. Das ist vermutlich body?
Korrekt wäre dann also, folgendes im head der HTML-Datei zu notieren:

<style type="text/css">
body
 { background-image:url(bilddatei.jpg);
   evtl. weitere CSS-Regeln
 }
</style>

Aber wenn ich mir dann im Internet Explorer das Endergebnis anschauen möchte, habe ich einen komplett leeren weißen Bildschirm.

In anderen Browsern wohl auch. ;-)
Das erinnert mich daran, dir ans Herz zu legen: Teste _immer_ auch mit einem anderen Browser als dem IE. Gerade der Microsoft-Browser hat teils ein sehr merkwürdiges Verhalten und sieht gern mal großzügig über Fehler hinweg. Für den Anwender mag das ein Vorteil sein - für den Webautor aber nicht. Denn dann fallen ihm seine Fehler nicht auf!
Empfehlenswert als Testbrowser unter Windows ist auf jeden Fall der Firefox, evtl. auch noch Opera. Beide sind kostenlos, unproblematisch zu installieren, und vertragen sich ausgezeichnet mit anderer Software.

Ich habe es auch schon mit kleineren Bildern versucht, weil ich gelesen habe, dass die Bilddateien durchaus zu groß sein können.

Ja, das soll es geben. Aber dann müssten die Bilddateien schon Größen im MB-Bereich haben. Im Interesse der Ladezeiten ist es schon ratsam, die Bilder so klein wie möglich zu machen (auf die Dateigröße bezogen!), aber mit ein paar hundert kB kommen die Browser problemlos klar.

Good luck,

Martin