Bild will nicht erscheinen

  • Hi Leute,


    hab erst vor kurzem angefangen mit HTML. Ich will aber auf jeden Fall tief einsteigen. Leider hab ich noch ein paar Probleme mit den Grundlagen.


    Ich hab das Problem, dass wenn ich versuche ein Hintergrundbild einzurichten, dass einfach nicht erscheint. Ich hab mittlerweile echt lange nach dem Fehler gesucht, aber nichts gefunden. Ich hoffe Ihr könnt mir helfen:


    html, body
    {
    background:url(C:\Users\User\Desktop\HTML\Bilder\1.jpg) no-repeat right top;
    font: 80% Verdana, Arial, Verdana, Helvetica, sans-serif;
    color: #ff0000;
    }


    in dem Seminar schreibt der Autor das einfach ins CSS und dann erscheint das. Bei mir aber nicht... Bei mir erscheinen sowieso nur Bilder, wenn ich sie seperat in dem HTML Doc. mit <img src="..."> einfüge. mit CSS kann ich gar nichts machen.
    Seht Ihr den Fehler? Habt Ihr eine Ahnung? Braucht Ihr noch mehr Informationen?
    Ich freue mich über jede Hilfe...

  • hast du nen webdevelop toolbar?
    Gug doch einfach mal was CSS für eine Background URL ausgibt.



    ich würde von dieser schreibweise sowie abraten.
    Kann mir zwar nicht erklären, warum CSS mit dieser schreibweise anscheinend nicht umgehen kann.


    Mach am besten so:


    CSS interpretiert soweit ich weiss URL von sich aus. (also dem ordner, wo die CSS datei liegt). Sollten die bilder im selben ordner liegen, so rreicht ein:


    Code
    background:url(1.jpg) no-repeat right top;


    Solltest du bilde im extra ordner haben mach einfach.


    Code
    background:url(bilder/1.jpg) no-repeat right top;


    Dieso schreibweise funktioniert sicherlich.





    PS: das problem seiner schreibweise ist auch, das sie nur auf deinem PC funktioniert. Beim hochladen ins internet müsstest du dann jede URL ändern. Desswegen immer von der datei selbst ausgehen.

  • hab mal rumprobiert. so musst du das schreiben. (ich rate dir trotzdem davon ab.)


    Code
    background-image: url(file:///D:/xampp/htdocs/blog2/admin/source/admin_style/images/box-open.png);
  • Zitat von &quot;Skanky&quot;

    hast du die CSS Datei in deiner HTML Datei eingebunden?


    Code
    <link rel="stylesheet" href="DEINE CSS DATEI" type="text/css" media="screen" />


    ja hab ich...


    danke erstmal für die schnellen antworten. Ich werde das mal ausprobieren.

  • Hi,


    schaust Du die HTML Seite lokal zu Hause an oder ist sie schon auf einen Webspace geladen worden? Spätestens dann macht die Angabe eines absoluten Pfades Probleme. Pfade zu anderen Dateien sollten immer relativ angegeben werden.
    Zur Erklärung: Klick
    Der Abschnitt "Mit absoluten Pfadangaben relativ zum Basis-URI referenzieren" ist der richtige für Dich.


    Am besten machst Du Dir zum Üben zu Hause auf deinem Rechner ein Verzeichnis, in das alle Dateien für die HTML Seiten kommen, in Unterordner würde ich dann die CSS Datei sowie die Bilder legen zum Beispiel /css/styleshett.css und /pics/bild.jpg. Dann wird das alles einfacher.


    Bei Fragen, einfach fragen :)


    Gruß Talwin

  • dank dir.


    ich werd das versuchen, wenn ich wieder gesund bin. Mich hatt die ärgste Grippe grade erwischt. Lieg nur noch im Bett. An HTML denke ich grade gar nicht :lol:

  • Zitat von &quot;Talwin&quot;

    Hi,


    schaust Du die HTML Seite lokal zu Hause an oder ist sie schon auf einen Webspace geladen worden? Spätestens dann macht die Angabe eines absoluten Pfades Probleme. Pfade zu anderen Dateien sollten immer relativ angegeben werden...


    ich hab das noch lokal bei mir, aber nach eurem Rat gebe ich das jetzt immer nur relativ an, was auch funktioniert, z.b. mit dem externen CSS.


    Leider funzt das mit dem Bild immernoch nicht. Ich weiß echt nicht woran das liegt. Um da jetzt weiterzukommen copy/paste ich mal alles was ich das jetzt so geschrieben hab:
    also erstmal das CSS:
    html, body
    {


    }


    #wrap {
    margin-left:5%;
    margin-right:5%; /*wrap soll der Aussenbereich werden*/
    }


    #logo {
    width:100%;
    background-image: url(Bilder\1.jpg); /* ich hab es mit "background: url()" und mit "background-image:url()" versucht*/
    float:left;
    }


    #navi {
    float:left;
    margin:150px 0px 0px 10px;
    padding-left:0 10px 0 10px;
    background-color: #F1F2FF;
    height:730px;


    }


    #navi li {


    margin: 30px 30px 30px 10px;
    list-style:square;
    }


    #inhalt {
    float:left;
    border:1px solid black;
    margin-top:150px;
    width: 80%;
    height:730px;
    }



    Und jetzt die HTML-Seite:


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">


    <head>
    <title>Titel</title>


    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <meta name="keywords" content="" />
    <meta name="generator" content="Webocton - Scriptly (<!-- w --><a class="postlink" href="http://www.scriptly.de">http://www.scriptly.de</a><!-- w -->)" />


    <link href="cssuebung.css" type="text/css" rel="stylesheet" />
    </head>


    <body>
    <div id="wrap">


    <div id="logo">
    </div>


    <div id="navi">


    <ul>
    <li>home</li>
    <li>tracklist</li>
    <li>profile</li>
    <li>contact</li>
    </ul>


    </div>


    <div id="inhalt">
    hi
    </div>



    </div>
    </body>
    </html>




    Ich hoffe damit klärt sich das Problem. Ich hab das bis jetzt noch nie hingekriegt ein Bild aus dem CSS reinzubekommen. Wenn ich im HTML-Doc mit <img src...> das mache ist das kein Problem. Das funktioniert immer. Aber nicht so.
    HILFE :cry:


    danke

  • ich weiss woran es liegt.... xDD
    In deinem <div id=logo></div> hast du keinen Inhalt darauf folgt, das die höhe 0 gesetzt wird. Entweder du fügst im css eine feste höhe ein, oder du musst in den div etwas reinschreiben.

  • Zitat von &quot;maulepan&quot;

    ich weiss woran es liegt.... xDD
    In deinem <div id=logo></div> hast du keinen Inhalt darauf folgt, das die höhe 0 gesetzt wird. Entweder du fügst im css eine feste höhe ein, oder du musst in den div etwas reinschreiben.


    ich hab da jetzt etwas reingeschrieben, das erscheint auch ganz brav an der richtigen stelle, aber das Bild ist nicht da.... :?:

  • Hallo, das muss ein slash sein:

    Code
    Bilder/1.jpg


    Die Bilddatei muss demnach von dem Verzeichnis ausgehend, wo die HTML Datei und die CSS Datei liegen im Unterordner Bilder liegen. Stimmt das? Außerdem muss die Groß/Kleinschreibung korrekt sein. Sicher dass das alles stimmt? .jpg ist nicht gleich .JPG und so weiter.


    Gruß Talwin

  • tataaaaaaaaaaaaaa hingekriegt :D


    ich hab heute morgen die Ordner so ein bissel hin und her geschoben und jetzt funktioniert es.
    Ich muss mir anscheinend noch mal das relative verlinken ganz genau anschauen und lernen :wink:
    naja, vielen dank für eure Hilfe

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!