1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen

Anfängerproblem Hintergrundbild CSS

Dieses Thema im Forum "Web-Programmierung" wurde erstellt von BenUtzer, 18.09.07.

  1. BenUtzer

    BenUtzer Ribston Pepping

    Dabei seit:
    21.08.06
    Beiträge:
    301
    Hallo zusammen,

    ich hab ein kleines Anfängerproblem. Ich lerne gerade autodidaktisch XHTML & CSS. Nachdem ich ein ganz nettes Layout des .html-Dokumentes via CSS hinbekommen habe, stellt sich mir die blöde Frage, wie ich ein .jpg, welches ich auf die Größe des Headers zugeschnitten und im gleichen Folder abgelegt habe wie die index-Datei, als Hintergrundbild in den Header einfügen kann.

    Ich bekomm den Link-Verweis auf den entsprechenden lokalen Ordner im Quelltext irgendwie nicht hin.

    Wäre nett, wenn mir jemand weiterhelfen könnte.

    Schöne Grüße und danke im Voraus

    Ben :-D
     
  2. msx3000

    msx3000 Martini

    Dabei seit:
    19.05.05
    Beiträge:
    646
    Hast Du im HTML ein DIV für deinen Header angelegt?

    Beispiel:
    <div id="header"></div>

    besagtes DIV sprichst Du dann über CSS an und gibst ihm Werte wie Höhe, Breite und hinterlegst dein Bild als Hintergrund.

    Beispiel:
    #header {height:oops:oopx; width:oops:oopx; background:url("dateiname.jpg") no-repeat;}

    schönen Gruß

    Matthias
     
    BenUtzer gefällt das.
  3. BenUtzer

    BenUtzer Ribston Pepping

    Dabei seit:
    21.08.06
    Beiträge:
    301
    Hi Matthias, erstmal herzlichen Dank für deine Hilfe.

    Genau, ich hab ein Div angelegt, so wie du es oben beschrieben hast. Größe etc. hab ich auch alles. Passt, wackelt und hat Luft.

    Ich hab nur ein Problem hiermit: background:url("dateiname.jpg") no-repeat;

    Alles innerhalb der "", sprich der Pfad, wie muss ich den anlegen wenn, die Ordnerstruktur z.Bsp. Festplatte/Ordner/Unterordner/bild.jpg auf einer lokalen Festplatte ist?

     
  4. msx3000

    msx3000 Martini

    Dabei seit:
    19.05.05
    Beiträge:
    646
    liegt deine HTML und CSS Datei im gleichen Ordner? Falls die CSS-Datei in einem eigenen Ordner liegt musst Du eine Ebene zurückgehen, dass macht man mit: ../dateiname.jpg
    das musste dann so geschrieben werden

    background:url("../dateiname.jpg") no-repeat;

    Ich habe meine HTML und CSS Dateien immer auf einer Ebene und Bilder in einem Ordner namens "pix". sieht dann so aus:

    background:url("pix/dateiname.jpg") no-repeat;

    schönen Gruß
    Matthias

     
  5. BenUtzer

    BenUtzer Ribston Pepping

    Dabei seit:
    21.08.06
    Beiträge:
    301
    Insgesamt sieht es im Stylesheet so aus:

    #header {
    width: 900px;
    float: left;
    padding: 10px;
    border: 1px solid #ccc;
    height: 100px;
    margin: 10px 0px 5px 0px;
    background-image: url("../headerr.jpg") no-repeat;
    }

    Ich seh das Hintergrundbild einfach nicht!
    :(

     
  6. bloodworks

    bloodworks Strauwalds neue Goldparmäne

    Dabei seit:
    01.09.06
    Beiträge:
    644
    versuch mal den Bild Link absolut anzugeben also "http://deinedomain.de/Bilderordner/Andererbilderordner/Bildname.jpg"

    Das ist übrings immer zu empfehlen, auch wenn du mal den File verschiebst dann bleibt das Bild da.
     
  7. Alferd

    Alferd Auralia

    Dabei seit:
    19.05.05
    Beiträge:
    202
    sollte es nicht background:url("../headerr.jpg") no-repeat; heissen?
     
  8. BenUtzer

    BenUtzer Ribston Pepping

    Dabei seit:
    21.08.06
    Beiträge:
    301
    Nett gemeint, aber ich sag ja, das Bild liegt lokal auf der Festplatte. Ich bastel hier nur etwas rum und hab noch keine Serveranbindung.
     
  9. bloodworks

    bloodworks Strauwalds neue Goldparmäne

    Dabei seit:
    01.09.06
    Beiträge:
    644
    Aso sry ja dann musts du den kompletten Pfand angeben (wenn dein delivery system kannn) oder das Bild relativ zum html File legen (gleicher Ordner oder dierekt drunter)
     
  10. Peter Maurer

    Peter Maurer Carmeliter-Renette

    Dabei seit:
    16.03.04
    Beiträge:
    3.274
    Nein.

    Wo liegt denn das Hintergrundbild, BenUtzer? Tatsaechlich eine Ordnerhierarchie weiter oben im Vergleich zu Deiner HTML-Datei?
     
    BenUtzer gefällt das.
  11. BenUtzer

    BenUtzer Ribston Pepping

    Dabei seit:
    21.08.06
    Beiträge:
    301
    Hab ich so übernommen, aber es tut sich trotzdem nichts.

    Gibt es dabei eine Reihenfolge, in der die einzelnen Selektoren stehen müssen?
     
  12. BenUtzer

    BenUtzer Ribston Pepping

    Dabei seit:
    21.08.06
    Beiträge:
    301
    Oha, Peter "the Mighty" Maurer :)

    Das Bild liegt mit der index.html im gleichen Ordner.
     
  13. BenUtzer

    BenUtzer Ribston Pepping

    Dabei seit:
    21.08.06
    Beiträge:
    301
    Danke an alle!

    Aus ("../headerr.jpg") hab ich ("headerr.jpg") gemacht, und schon läufts !
     
  14. msx3000

    msx3000 Martini

    Dabei seit:
    19.05.05
    Beiträge:
    646
    schön! viel Spaß noch beim lernen;).

    Kennst Du schon die üblichen Verdächtigen:
    CSS4You
    SelfHtml
    ?

    viele Grüße

    Matthias
     
  15. BenUtzer

    BenUtzer Ribston Pepping

    Dabei seit:
    21.08.06
    Beiträge:
    301
    Klar, ich hätte da noch http://www.alvit.de/handbook/ anzubieten, das ist der ultimative Tipp für jeden, der sich etwas mit der Materie beschäftigt.
     
  16. msx3000

    msx3000 Martini

    Dabei seit:
    19.05.05
    Beiträge:
    646
    Etwas? Der absolute Overkill an Websites:-D
     
  17. BenUtzer

    BenUtzer Ribston Pepping

    Dabei seit:
    21.08.06
    Beiträge:
    301
    Sicherlich, aber wenn du mal echt konzentriert draufschaust, wirst du sehen dass das ausnahmslos qualifizierte Links sind! Sei es zum Thema Farbe, zu irgendwelchen CSS-Techniken, einfach alles...
     

Diese Seite empfehlen