ham: (CSS) hintergrundbild wird nicht angezeigt

Hallo,

habe eine style.css Datei erstellt, in der ich meine ganzen
Styles beherberge. Alles problemlos, von der Anzeige der Links
und Leisten bis hin zu den Schriften.

Wenn ich nun ein Hintergrundbild in dieser Datei (style.css)
einbinde, wird es im ie nicht angezeigt.
Komisch ist nur, wenn ich das eingebundene Hintergrundbild
aus der style.css entferne und in die Seite unter <style type="...
kopiere, wird mein Hintergrundbild angezeigt.

Meine Frage: ich will in style.css mein Hintergrundbild
definieren, und dann nur mit <div id="z.b.bild"></div>
aufrufen. wie geht das?

ham

  1. Hallo,

    Da Du leider weder Quellcode noch eine URL gepostet hast,
    kann ich nur Glaskugeln...

    Komisch ist nur, wenn ich das eingebundene Hintergrundbild
    aus der style.css entferne und in die Seite unter <style type="...
    kopiere, wird mein Hintergrundbild angezeigt.

    Kontrolliere die Pfade...

    Ich vermute ein Referenzierungs-Problem
    (Pfad von der CSS-Datei zur Grafik-Datei).

    http://selfhtml.teamone.de/html/allgemein/referenzieren.htm
    http://selfhtml.teamone.de/css/eigenschaften/hintergrund.htm#background_image

    <div id="z.b.bild"></div>

    z.b.bild ist kein gueltiger Klassenname in CSS.
    http://www.w3.org/TR/REC-CSS2/syndata.html#q4

    Gruesse,

    Thomas

    --
    Bitte keine Mails mit Fachfragen - dafuer gibt es das Forum!
    Ich mag es, wenn URLs verlinkt sind (</faq/#Q-19>).
    Oft gestellte PHP-Fragen beantwortet die dclp-FAQ bestens: http://www.dclp-faq.de/
    1. Hallo Thomas,
      so gehts:
      <link rel="stylesheet" type="text/css" href="css/style.css">
      <style type="text/css">
      #bimage {
      background-image:url(images/logo.gif);
      background-repeat:no-repeat;
      width:100%;
      height:100%;
      border:thin solid #CCCCFF;
      z-index:3;}
      </style>

      <body>

      <div id="leisteli"></div>
      <div id="logo01">xyz</div>

      <div id="bimage"></div>
      </body>

      Aber wenn ich
      #bimage {
      background-image:url(images/logo.gif);
      background-repeat:no-repeat;
      width:100%;
      height:100%;
      border:thin solid #CCCCFF;
      z-index:3;}
      in die style.css einbinde wird kein background angezeigt.

      MfG
      ham

      1. Hallo,

        Wie lauten die drei betroffenen URLs?

        • HTML-Datei
        • CSS-Datei
        • Grafik

        Gruesse,

        Thomas

        1. Hallo,

          Wie lauten die drei betroffenen URLs?

          • HTML-Datei

          test/test.html

          • CSS-Datei

          test/css/style.css

          • Grafik

          test/images/logo.gif

          Gruesse,

          Thomas

      2. Hallo,

        Offenbar hast Du folgende Pfade:

        /seite.html
        /css/style.css
        /images/logo.gif

        Der Pfad von style.css zu logo.gif lautet dann:
        ../images/logo.gif

        Thomas

      3. Hallo,

        hier liegt das problem:

        href="css/style.css"
        [...]
        background-image:url(images/logo.gif);

        -> die "style.css" sucht im Ordner "css" den Ordner "images" und darin das Bild "logo.gif"
        -> und dort wird es sicherlich nicht zu finden sein, oder?

        mfg NAG

        --
        signatur
      4. Hallo,

        Probier mal: background-image:url("../images/logo.gif");
        Ich vermute mal, dass du einen Ordner erstellt hast, in dem alle Dateinen liegen und dann zwei weitere Ordner mit CSS und Images erstellt hast.
        Da du von dem CSS-Ordner in den Images-Ordner wechseln willst, musst
        du auch zuerst in den Hauptordner zurück.

        Aber wenn ich
        #bimage {
        background-image:url(images/logo.gif);
        background-repeat:no-repeat;
        width:100%;
        height:100%;
        border:thin solid #CCCCFF;
        z-index:3;}
        in die style.css einbinde wird kein background angezeigt.

        Gruß Bjoern

        1. Hallo zusammen,
          ich bin ja blöd, ist mir jetzt klar ws für´n Depp ich war.

          danke!!!!!!
          ham

      5. Hallo ham,

        <link rel="stylesheet" type="text/css" href="css/style.css">
        background-image:url(images/logo.gif);

        ich tippe mal darauf, dass der Browser das Bild einmal von der html-Datei aus sucht, und einmal von der css-Datei aus, und da die css-Datei in einem anderen Ordner liegt, findet er sie dann nicht. Versuch mal in die css-Datei als url nicht "images/logo.gif" zu schreiben, sondern "../images/logo.gif".

        Grüße aus Nürnberg
        Tobias

        --
        Selfcode: sh:( fo:) ch:? rl:( br:< n4:& ie:% mo:| va:) de:] zu:) fl:( ss:| ls:[ js:|
        1. Hi,

          ich tippe mal darauf,

          Nicht tippen, nachgucken:

          <cite source="http://www.w3.org/TR/REC-CSS2/syndata.html#uri">
          In order to create modular style sheets that are not dependent on the absolute location of a resource, authors may use relative URIs. Relative URIs (as defined in [RFC1808]) are resolved to full URIs using a base URI. RFC 1808, section 3, defines the normative algorithm for this process. For CSS style sheets, the base URI is that of the style sheet, not that of the source document.
          </cite>

          cu,
          Andreas

          --
          MudGuard? Siehe http://www.mud-guard.de/
          1. Hallo Andreas,

            Danke fuer's nachgucken.

            For CSS style sheets, the base URI is that of the style sheet, not that of the source document.

            Bleibt noch zu ergaenzen, dass Netscape 4.x das anders sieht ;-)
            (Wer dazu eine Quelle/URL hat, bitte posten...)

            Ein paar Loesungen zu diesem Problemchen:

            • CSS vor Netscape 4 verstecken (meine Lieblings-Loesung;-)
            • "absolute" URL (beginnend mit "http://" oder "/") verwenden.
            • HTML- und CSS-Dateien im gleichen Verzeichnis
            • Verzeichnis-Struktur so anlegen, dass der relative
                Pfad zum Bild von der HTML- und der CSS-Datei aus
                gesehen gleich ist.

            Gruesse,

            Thomas
              der sich an seiner Glaskugel freut;-)