HTML Image won t display

Question

I m kind of new to HTML  I m trying to display an image on my website but for some reason  it just shows a blue box with a question mark in it  I ve looked everywhere on the internet  but none of the solutions seemed to work for me  I ve tried    lt img src  iwojimaflag jpg   gt    lt img src  images iwojimaflag jpg   gt    lt img src  Applications MAMP htdocs Symfony src Acme WebBundle Resources public images iwojimaflag jpg   gt

User · Answer

Here are the most common reasons

Incorrect file paths
File names are misspelled
Wrong file extension
Files are missing
The read permission has not been set for the image(s)

Note: On *nix systems, consider using the following command to add read permission for an image:

chmod o+r imagedirectoryAddress/imageName.extension

or this command to add read permission for all images:

chmod o+r imagedirectoryAddress/*.extension

If you need more information, refer to this post.

User · Answer

Lets look at ways to reference the image   Back a directory        Folder in a directory    foldername    File in a directory   imagename jpg   Now  lets combine them with the addresses you specified     Resources views Default index html   Resources public images iwojimaflag jpg   The first common directory referenced from the html file is three back                It is in within two folders in that             public images    And you ve reached the image             public images iwojimaflag jpg   Note  This is assuming you are accessing a page at domain com Resources views Default index html as you specified in your comment

User · Answer

I found that skipping the quotation marks    around the file and location name displayed the image    I am doing this on MacBook

User · Answer

If you put    lt img src  iwojimaflag jpg   gt  in html code then place iwojimaflag jpg and html file in same folder   If you put  lt img src  images iwojimaflag jpg   gt  then you must create  images  folder and put image iwojimaflag jpg in that folder

User · Answer

Just to expand niko s answer   You can reference any image via its URL  No matter where it is  as long as it s accesible you can use it as the src  Example   Relative location    lt img src  images image png  gt    The image is sought relative to the document s location  If your document is at http   example com site document html  then your images folder should be on the same directory where your document html file is   Absolute location    lt img src   site images image png  gt   lt img src  http   example com site images image png  gt    or   lt img src  http   another-example com images image png  gt    In this case  your image will be sought from the document site s root  so  if your document html is at http   example com site document html  the root would be at http   example com   or it s respective directory on the server s filesystem  commonly www    The first two examples are the same  since both point to the same host  Think of the first   as an alias for your server s root  In the second case  the image is located in another host  so you d have to specify the complete URL of the image   Regarding      and      The   symbol will always return the root of a filesystem or site   The single point    points to the same directory where you are   And the double point     will point to the upper directory  or the one that contains the actual working directory   So you can build relative routes using them   Examples given the route http   example com dir one two three  and your calling document being inside three       pictures image png    or just   pictures image png    Will try to find a directory named pictures inside http   example com dir one two three        pictures image png    Will try to find a directory named pictures inside http   example com dir one two      pictures image png    Will try to find a directory named pictures directly at   or example com  which are the same   on the same level as directory

User · Answer

I confess to not having read the whole thread  However when I faced a similar issue I found that checking carefully the case of the file name and correcting that in the HTML reference fixed a similar issue  So local preview on Windows worked but when I published to my server  hosted Linux  I had to make sure  mugshot jpg  was changed to  mugshot JPG   Part of the problem is the defaults in Windows hiding full file names behind file type indications

User · Answer

x000D   x000D  img   x000D    width  200px  x000D    x000D   lt img src  https   image ibb co gmmneK children 593313 340 jpg   gt  x000D   x000D   lt img src  https   image ibb co e0RLzK entrepreneur 1340649 340 jpg   gt  x000D   x000D   lt img src  https   image ibb co cks4Rz typing 849806 340 jpg   gt  x000D   x000D   x000D    please see the above code

[html] HTML: Image won't display?

Here are the most common reasons

Incorrect file paths

File names are misspelled

Wrong file extension

Files are missing

The read permission has not been set for the image(s)

Examples related to html

Examples related to image

Examples related to web