HTML showing broken image

Question

i have the following html code and when i pull it up in my browsers the image either doesnt show up, or it shows a broken image:

<!DOCTYPE html>
<html>
    <head>
    <title>Lets Play Battleship</title>
    <link rel="stylesheet" href="style.css">
    </head>

    <body>
        <h1>
            Battleship
            <p><img src="battleship-game-board.jpg" width = "120" height = "90"/></p>
        </h1>


        <p><a href="http://www.freeonlinegames.com/game/battleships"> Click Here to Play Battleship</a></p>

    </body>
</html>

make sure that the image is placed on the same path where the html file is.. — Raab, Sep 10 '13 at 07:16

score 7 · Answer 1 · edited May 23 '17 at 12:33

To make image work either you use:

Absolute path:

<img src="http://www.domain.com/MyImages/battleship-game-board.jpg"/>

or

Relative path:

<img src="../MyImages/battleship-game-board.jpg"/>

if image exist in same folder the html file exist then you can use:

<img src="battleship-game-board.jpg" width = "120" height = "90"/>

More details here

Note: image must exist in given path in all cases.

score 1 · Answer 2 · answered Sep 10 '13 at 07:25

1

This is due to the following reason.

1>The battleship-game-board.jpg is not in the same directory of same file.

2>battleship-game-board.jpg do not contain valid permission. If you are using linux then you have to specify 755 permission on battleship-game-board.jpg image.

You could use


    chmod 755 battleship-game-board.jpg

answered Sep 10 '13 at 07:25

Parag Kuhikar

485
2
6
17

thanks for all of the responses I checked and had the file name spelled incorrectly. thanks for your responses though. – Sep 10 '13 at 09:47

score 0 · Answer 3 · answered Sep 10 '13 at 07:24

0

<img src="battleship-game-board.jpg" width = "120" height = "90"/>.

What in the src="" should be a path, but not a title of image. It means you should input the path of battleship-game-board.jpg, but not the image name.

answered Sep 10 '13 at 07:24

Ring

31
4

user3726207 · Answer 4 · 2023-08-26T09:26:25.633

Having migrated a site, I have been chasing the same problem with images not showing for a couple of days with thousands of images, which I know exist. If I tried to connect directly to an image I got a 403. I found a post on another forum referring to Hotlink protection. I had changed the domain for the site, and I had hotlink enabled for image files (.jpg, .gif, .png). I am working on a shared server via cPanel and when I checked the list of Allowed Referrers in cPanel, the new domain was not in the list. There is no apparent way to add a domain to the list but I discovered that if you disable protection and then re-enable it, the new domain will appear in the list. Once that was done all the images were showing.

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). — Community, Aug 03 '23 at 11:54

HTML showing broken image

4 Answers4

Linked