Hintergrundbild per CSS definieren
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
anweisung
bild
code
datei
definition
fehler
hintergrund
http
image
kompletten code
liefern
liegen
listen
pfad
raute
richtigen code
tag
totaler quark
url
vergeben
-
Hallo Lima-City-Community
Ich würde ganz gerne ein tag/bild">Bild für den Hintergrund verwenden und fand auf einer Website folgenden Vorschlag:
body {background-image:url('paper.gif');}
Daraufhin habe ich also folgendes in meine CSS-Datei geschrieben
#html
{
width: 1200px;
background-image: url('Bilder/hintergrund.jpg');
}
Das Bild "soccaz.lima-city.de/Bilder/hintergrund.jpg" existiert. Der Pfad stimmt also. Es wird mir allerdings kein Bild angezeigt. Was mache ich falsch?
Vielen lieben Dank im Voraus -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
so weit ich weiß ist es nicht üblich dass dem html Tag styles zugewiesen werden.
Wieso machst du es nicht genau so, wie du es gefunden hast? Das ist der korrekte Weg!
#body { width: 1200px; background-image: url('Bilder/hintergrund.jpg'); }
MFG -
Hallo, vielen Dank für deine Antwort
Leider funktioniert es auch nicht mit body. Ich hatte auch testweise schon versucht, meinem Header-Div das Hintergrundbild auf die gleiche Art zuzuweisen. Das hat auch nicht funktioniert. -
Kommt genau dasselbe bei raus
-
programtools schrieb:
Wozu die Raute?
so weit ich weiß ist es nicht üblich dass dem html Tag styles zugewiesen werden.
Wieso machst du es nicht genau so, wie du es gefunden hast? Das ist der korrekte Weg!
#body { width: 1200px; background-image: url('Bilder/hintergrund.jpg'); }
#body würde sich auf eine id beziehen.
Richtig wäre
body { width: 1200px; background-image: url('Bilder/hintergrund.jpg'); } -
soccaz schrieb:
Hast Du meinen Beitrag nicht verstanden? Eben weil es keine ID namens body gibt, kann es auch nicht funktionieren.
Wenn ich die Raute weg nehme, kommen auch sämtliche anderen CSS-Anweisungen nicht mehr an. Es sieht mir schon so aus, als ob sie dahin muss. Eine ID namens body habe ich nicht vergeben. Es ist schon der HTML-Body gemeint.
Das bezieht sich nur auf body {...} und nicht auf alle anderen id´s.
Du verwendest ja kein <div id="body"> also ist auch die Anweisung #body {...} Blödsinn, weil es sich mit der Raute auf eine id bezieht.
Genau das gleiche mit #Html{...}
Findest Du es nicht etwas seltsam, dass es bei anderen und auch bei mir funzt, bei Dir aber nicht?
Finde den Fehler.
Beitrag zuletzt geändert: 11.12.2012 17:02:42 von menschle -
soccaz schrieb:
Schwachsinn...
Wenn ich die Raute weg nehme, kommen auch sämtliche anderen CSS-Anweisungen nicht mehr an. Es sieht mir schon so aus, als ob sie dahin muss. Eine ID namens body habe ich nicht vergeben. Es ist schon der HTML-Body gemeint.
Ein bisschen Nachhilfe könnte nicht schaden.
Wenn du es so machst, wie "menschle" es dir versucht zu erklären, funktioniert es.
Beitrag zuletzt geändert: 11.12.2012 17:04:31 von ploco -
ploco schrieb:
Jepp, und hier stehts nochmal extra für das background-image.
Ein bisschen Nachhilfe könnte nicht schaden.
Und noch ein Beispiel einer Produktivseite.
-
Sorry die Raute hatte ich garnicht gesehen, ist natürlich totaler Quark :)
Wie wärs wenn du mal etwas mehr Code zeigst? Denn scheinbar muss der Fehler irgendwoanderst liegen, die definition für das BGImg ist korrekt!
MFG -
programtools schrieb:
Sorry die Raute hatte ich garnicht gesehen, ist natürlich totaler Quark :)
Wie wärs wenn du mal etwas mehr Code zeigst? Denn scheinbar muss der Fehler irgendwoanderst liegen, die definition für das BGImg ist korrekt!
MFG
Wie wäre es wenn du uns mehr Code zeigst? Wir können ja dir immer den richtigen Code liefern wenn der Fehler, wie du selbst feststellst, nicht an den eigentlichen Background-Code liegt. Poste einfach mal die URL oder den kompletten Code dazu, dann kann man mit Firebug den Fehler suchen.
MfG Stephan -
daswing schrieb:
Wie wäre es wenn du uns mehr Code zeigst? Wir können ja dir immer den richtigen Code liefern wenn der Fehler, wie du selbst feststellst, nicht an den eigentlichen Background-Code liegt. Poste einfach mal die URL oder den kompletten Code dazu, dann kann man mit Firebug den Fehler suchen.
MfG Stephan
Meinst du mich :) ?
Denn ich weiss wie das geht, ich bin ja nicht der Threadsteller. Ansonsten ist das ja genau was ich meinte, er soll uns etwas mehr Code zeigen!
(Ich wollte nur nicht, dass es hier zu Missverständnissen kommt. Dieser Post kann dann ggF von nem Mod wieder gelöscht werden)
MFG -
programtools schrieb:
Wie wärs wenn du mal etwas mehr Code zeigst? Denn scheinbar muss der Fehler irgendwoanderst liegen, die definition für das BGImg ist korrekt!daswing schrieb:
Wie wäre es wenn du uns mehr Code zeigst? Wir können ja dir immer den richtigen Code liefern wenn der Fehler, wie du selbst feststellst, nicht an den eigentlichen Background-Code liegt. Poste einfach mal die URL oder den kompletten Code dazu, dann kann man mit Firebug den Fehler suchen.
Es geht scheinbar um diese Webseite, mit diesem CSS. Und dort steht..
#html { width: 1200px; } #body { width: 1200px; background-image: url('Bilder/hintergrund.jpg'); background-repeat: no-repeat; } usw..
..und dann bleibt da noch die Frage, ob das Hintergrundbild bei
überhaupt groß zu sehen ist..background-repeat: no-repeat;
;)
-
Fassen wir mal die bisherigen Antworten, die alle richtige Ansätze hatten, zusammen:
1. Im CSS muß das body-Tag und nicht ein Tag mit der ID 'body' angesprochen werden. Ergo: "body{...}" statt "#body{...}
2. Der Pfad zum Bild stimmt nicht. Das Stylesheet liegt im Unterordner css. Die Notation "BilderBildname" läßt im Ordner css/Bilder/" suchen. Korrekt wäre "../Bilder/hintergrund.jpg".
Bisher noch nicht erwähnt:
Fehler im HTML-Code, die durchaus zu unerwarteten Ergebnissen und/oder Fehlverhalten führen können:
- Du gibst keinen DOCTYPE vor. Das ist zwar hier nicht maßgeblich, verändert aber das Verhalten der Browser.
- unsaubere HTML-Struktur Nach dem öffnenden Body-Tag bindest Du noch ein zusätzliches <head> ein.
Minimalst korrigiert sollte dein HTML so aussehen: *click*
Auf die DIV-Sammlungen für die Seiten- und Footerlinks solltest Du ebenfalls verzichten. Solche Listen lassen sich, wer hätte es bei dem Begriff gedacht
, besser mit einem vernünftig formatierten Listen-Tag gestalten.
Beispiel:
<ul> <li>1.Link</li> <li>2.Link</li> <li...</li> </ul>
Beitrag zuletzt geändert: 13.12.2012 1:37:46 von fatfreddy -
yo mey! wie @menschle und @fatfreddy schon sagte ...: gold richtig.
abrundend kommt - nach dem er die ratschläge befolgt hat - hinzu, dass im cssbody { ...; background-image: url('../Bilder/hintergrund.jpg'); ...; }stehen sollte (weil relativ zu css-datei). -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
