HTML: Bild wird nicht angezeigt?

Ich bin Art von neuen zu HTML. Ich bin versucht, ein Bild anzuzeigen, das auf meiner website, aber für einige Grund, es zeigt nur ein blaues Kästchen mit einem Fragezeichen darin. Ich habe überall gesucht im internet, aber keine der Lösungen scheint zu funktionieren für mich. Ich habe versucht:

<img src="iwojimaflag.jpg"/>

<img src="images/iwojimaflag.jpg"/>

<img src="Applications/MAMP/htdocs/Symfony/src/Acme/WebBundle/Resources/public/images/iwojimaflag.jpg"/>
  • Wo ist dein gespeichertes Bild relativ zur HTML-Datei (z.B.: HTML ist an "myapp/index.html" und Bild "myapp/images/myimage.jpg" ?
  • Bild: "/Resources/public/images/iwojimaflag.jpg" -------------------- html: "/Resources/views/Default/index.html-Code.twig"
InformationsquelleAutor Gretta | 2014-06-17
  1. 4

    Einfach zu erweitern niko's Antwort:

    Können Sie auf jedes Bild über dessen URL. Egal wo es ist, solange es erreichbar Sie können es verwenden, als die src. Beispiel:

    Relative Lage:

    <img src="images/image.png">

    Wird das Bild gesucht relativ zum Dokument Standort. Wenn Ihr Dokument ist bei http://example.com/site/document.html, dann Ihre images Ordner muss sich im selben Verzeichnis, wo Ihre document.html Datei ist.

    Absolute Lage:

    <img src="/site/images/image.png">
<img src="http://example.com/site/images/image.png">

    oder

    <img src="http://another-example.com/images/image.png">

    In diesem Fall, wird Ihr Bild gesucht aus dem Dokument Website root, also, wenn Ihr document.html ist bei http://example.com/site/document.html, der root würde bei http://example.com/ (oder die betreffende Verzeichnis auf das Dateisystem des Servers, meist www/). Die ersten beiden Beispiele sind identisch, da beide auf dem gleichen host, Denken Sie an die ersten / als alias in das Stammverzeichnis Ihres Servers. Im zweiten Fall, das Bild befindet sich in einem anderen host, so müssten Sie geben Sie die vollständige URL des Bildes.

    Über /, . und ..:

    Den / symbol wird immer wieder die root des Dateisystems oder der Website.

    Den einzigen Punkt ./ Punkte in das gleiche Verzeichnis, wo Sie sind.

    Und der Doppel-Punkt ../ auf das Obere Verzeichnis, oder die eine enthält die eigentlichen Arbeitsverzeichnis.

    So können Sie bauen relativ Routen, die Sie verwenden.

    Beispiele gegeben, die route http://example.com/dir/one/two/three/ und Ihre aufrufen Dokument in three/:

    "./pictures/image.png"

    oder nur

    "pictures/image.png"

    Wird versuchen zu finden, ein Verzeichnis mit dem Namen pictures innen http://example.com/dir/one/two/three/.

    "../pictures/image.png"

    Wird versuchen zu finden, ein Verzeichnis mit dem Namen pictures innen http://example.com/dir/one/two/.

    "/pictures/image.png"

    Wird versuchen zu finden, ein Verzeichnis mit dem Namen pictures direkt an / oder example.com (die sind identisch), auf der gleichen Ebene wie directory.

    • Ok, also ich versuchte es mit "localhost/Applications/MAMP/htdocs/Symfony/src/Acme/WebBundle/..." und ich bekam eine 404-nicht gefunden " - Fehler, aber ich doppelt überprüft, dass das Bild da ist!! Ich auch doppelt geprüft, dass die url richtig ist!
    • Ich habe auch versucht <img src="..."/>' and replaced the ...` mit dem, was Sie oben gesagt, aber laut meinem Verzeichnis. Hat nicht funktioniert.
    • Wenn Sie die Angabe des host-Namen, den Sie vorausgehen sollte es durch http:// oder was auch immer-Protokoll Sie verwenden, um das Bild abzurufen. Beachten Sie auch, dass die Wurzel Ihrer Website =/= die Wurzel Ihres Dateisystems. http://localhost kann auf /var/www/ nicht /.
    • oh ya ich habe put http:// ich weiß nicht, warum es nicht in den Kommentar
    • Sehen Sie, wenn Sie einen server starten, es werde eine virtual root auf das Dateisystem, und es wird in den Ordner konfiguriert werden, die website root. Sagen wir mal dein Dateisystem-root ist /, und dein server ist so konfiguriert, dass es die Wurzel zu /var/www/, so http://localhost/ startet am /var/www/, und wenn Sie versuchen, Zugriff auf http://localhost/pic/image.png du musst dein Bild bei /var/www/pic/image.png
    • Ebenso, wenn Ihr Dokument ist bei http://localhost/doc/index.html oder /var/www/doc/index.html auf das Dateisystem und wenn Ihr Dokument fordert ein Bild mit src=pic/image.png dein Bild sollte /var/www/doc/pic/image.png. Oder, wenn sich src=/pic/Bild.png dann werde es an /var/www/pic/image.png
    • sind Sie sicher, dass Ihre src Attribut liest images/image.jpg?
    • Yup. <img src="images/iwojimaflag.jpg"/> Ich wörtlich kopiert und eingefügt, dass. Obwohl ich überprüft, die Datei-Typ und es sagt, es ist ein jpeg-Bild. Aber die Erweiterung ist jpg..?
    • Die Endung spielt keine Rolle, haben Sie versucht, das entfernen Sie, dass trailing /? haben Sie versucht, mit einem anderen Bild (auf einem anderen Rechner, wie zum Beispiel goo.gl/AJm0rS ?)
    • Ja, ich habe versucht, mit einem anderen Bild. Ich weiß nicht, was du meinst mit dem trailing / weil ich sehe es nicht. Das Bild zeigt nur, wenn ich geben Sie einfach die website-Adresse, die ich bekam es von.
    • Statt <img src="…"/> verwenden <img src="…">, was meinst du mit geben Sie einfach die Webseiten-Adresse, ich habe es von? wo haben Sie die Adresse?

    InformationsquelleAutor arielnmz
  2. 3

    Betrachten wir Möglichkeiten, um auf das Bild verweisen.

    Wieder ein Verzeichnis

    ../

    Ordner in einem Verzeichnis:

     foldername/

    Datei in ein Verzeichnis

     imagename.jpg

    Nun, können Sie kombinieren diese mit den Adressen, die Sie angegeben.

     /Resources/views/Default/index.html
 /Resources/public/images/iwojimaflag.jpg

    Den ersten gemeinsamen Verzeichnis auf die verwiesen wird aus der html-Datei ist, drei zurück:

     ../../../

    Es ist in zwei Ordnern, in:

     ../../../public/images/

    Sind und Sie erreicht haben, Bild:

     ../../../public/images/iwojimaflag.jpg

    Hinweis: Dies wird vorausgesetzt, Sie sind auf einer Seite an domain.com/Resources/views/Default/index.html wie Sie in Ihrem Kommentar.

    • also... was soll ich schreiben in meinem code? <img src="/public/images/iwojimaflag.jpg/>"? Denn das hat bei mir nicht funktioniert. Ich habe auch versucht <img src="../../../public/images/iwojimaflag.jpg"/> - und das auch nicht funktionieren.
    • Gut..... was ist die Adresse in der Adressleiste beim anzeigen index.html?
    • Sie schrieb schon dort oben. ../Resources/views/Default/index.html
    • So... haben Sie bereits die Antwort dann. Einfach oben schauen. Wenn es nicht funktioniert, schauen Sie in Ihren browser-debugger und Adresse Fehler... oder fixieren Sie Ihre website-setup. Viel Glück
    InformationsquelleAutor
  3. 0

    Wenn Sie <img src="iwojimaflag.jpg"/> im html-code dann iwojimaflag.jpg und die html-Datei im gleichen Ordner.

    Wenn Sie <img src="images/iwojimaflag.jpg"/> dann müssen Sie diese erstellen "images" - Ordner und setzen Sie Bild iwojimaflag.jpg in diesem Ordner.

    • das versucht. hat nicht funktioniert.
    InformationsquelleAutor Arshid KV
  4. 0

    CSS:

    img {
  width: 200px;
}

    HTML:

    <img src="https://image.ibb.co/gmmneK/children_593313_340.jpg"/>

<img src="https://image.ibb.co/e0RLzK/entrepreneur_1340649_340.jpg"/>

<img src="https://image.ibb.co/cks4Rz/typing_849806_340.jpg"/>

    bitte sehen Sie sich den obigen code.

    InformationsquelleAutor Arshiya Khanam
  5. -1

    Ich gestehen nicht den ganzen thread durchgelesen. Jedoch, wenn ich vor einem ähnlichen Problem fand ich, dass die Prüfung sorgfältig die Fall den Namen der Datei, und korrigieren, dass Sie in der HTML Referenz behoben, die ein ähnliches Problem.
    Also der lokalen Vorschau auf Windows gearbeitet, aber wenn ich bereits auf meinen server (gehostet, Linux) hatte ich sicherstellen "mugshot.jpg" wurde geändert in "mugshot.JPG". Teil des Problems ist der standardmäßig in Windows versteckt vollständigen Dateinamen hinter Dateityp Indikationen.

    InformationsquelleAutor Clyde
  6. -1

    Fand ich, dass das auslassen der Anführungszeichen "" um die Datei und den Speicherort name angezeigt, das Bild...
    Ich Tue dies auf dem MacBook....

    InformationsquelleAutor Marcin
  7. -1

    Hier sind die häufigsten Gründe

    • Falsche Datei Pfade

    • Datei-Namen sind falsch geschrieben

    • Eine falsche Datei-Erweiterung

    • Dateien fehlen

    • Die Berechtigung "Lesen" nicht für die image(s)

    Hinweis:
    Auf *nix-Systeme sollten mit dem folgenden Befehl fügen Sie die Berechtigung " Lesen für ein Bild:

    chmod o+r imagedirectoryAddress/imageName.extension

    oder diesem Befehl fügen Sie die Berechtigung " Lesen für alle Bilder:

    chmod o+r imagedirectoryAddress/*.extension

    Wenn Sie weitere Informationen benötigen, Lesen Sie bitte diesen post.

    InformationsquelleAutor Farhad Maleki
Schreibe einen Kommentar