CODEWITHSUNDEEP
htmlimagesrc
user1926913
user1926913

Reputation:

HTML showing broken image

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>

Upvotes: 3

Views: 60450

Answers (4)

user3726207
user3726207

Reputation: 11

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.

Upvotes: 0

Parag Kuhikar
Parag Kuhikar

Reputation: 485

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

Upvotes: 1

Ashwani
Ashwani

Reputation: 3491

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.

Upvotes: 7

Ring
Ring

Reputation: 41

<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.

Upvotes: 0

Related Questions