HTML <img> tag is not working
Question
I am using following simple HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<body>
<img src="loading.gif" alt="MISSING GIF">
<img src="j.JPG" alt="MISSING JPG">
</body>
</html>
loading.gif and j.jpg are present in same directory as html file. loading.gif is displayed fine in ie 8 but j.jpg doesn't load.
When I use firefix, both images display correctly.
Please help
10 answers
solution1
7 2013-01-26 19:11:23
Check that JPG file extension is uppercase in the file system. I suspect that it is lowercase. Also be sure to close the image tag.
<img src="j.jpg" alt="MISSING JPG"/>
solution2
1 2013-01-26 19:14:07
<img src="loading.gif" alt="MISSING GIF">
会是这样
<img id="ImgEmployee" src="Photos/loading.gif" alt="MISSING GIF" />
solution3
1 2014-05-02 11:59:09
我遇到了同样的问题，我发现在使用 wordpress 时，您应该对图像使用以下代码：
<img src="<?php bloginfo('template_directory'); ?>/images/example.jpg" alt = "example">
solution4
1 2015-04-02 00:31:01
Was the img file originally in another extension? If so, revert to the original extension.
I took a screenshot on my Windows PC in .png format. I changed the extension to .jpg (thinking it would work the same as my Mac). IE didn't like it, but Firefox was fine with it.
<img src="1.jpg" />
I changed the extension back to .png, and it worked fine in both browsers.
<img src="1.png" />
solution5
0 2013-01-26 19:12:40
lowercase the extension, and close the img tags, you are using XHTML 1.0 Strict !
<img src="loading.gif" alt="MISSING GIF" />
<img src="j.jpg" alt="MISSING JPG" />
EDIT : maybe you hit a IE8 bug... +1 to the question :)
Let's try like this: using a page really XHTML 1.0 Strict compliant,
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>hi!</title>
</head>
<body>
<div>
j.JPG : <img src="j.JPG" alt="MISSING JPG" />
(upper case) <br/>
j.jPG : <img src="j.jPG" alt="MISSING JPG" />
(first lower case, others upper case <br/>
j.jpg : <img src="j.jpg" alt="MISSING JPG" />
(lower case) <br/>
</div>
</body>
</html>
create two copies of the file, so you will have the three files listed above. Then run the page in IE8 and tell us which one is working...
solution6
0 2013-01-26 19:55:43
Is it broken in IE9/10 too?
Also, if the code you posted above is exactly what's in your file, you have an incorrect character (`) right before the doctype declaration.
Internet Explorer breaks when your HTML is wrong, browsers like Firefox are much more lenient and try and fix things for you.
solution7
0
I think it is because of the specific images. Check if you have permission to use those files. I also had the same problem. I had two OS(Ubuntu and Windows) running and the image I was using was coming from Windows local disk. After I solved this permission issue, it worked.
solution8
0 2014-04-26 04:30:17
recently i was working in a web project using WAMP server. i placed my web site under c:/wamp/www/my_site folder and referenced an image from this folder on a page. the image did not display. i referenced another image at desktop ...bingo, it worked. i think its the permission thing ... :)
solution9
0 2019-03-09 17:25:24
Did you checked if there is some difference in the header? This happens sometimes that due to some GET requests header changes to something like this: {https:www.xyz.com/?id=blah-blah}. Now since no such file exist in the directory, the img tag remains clueless that actually where it had to look for the resource. You need to change send header again to the same page so that no GET request get connected to the address this time. Took me a long time to figure out.
solution10
0 2022-11-27 12:25:15
Check for cors setting, sometime server might be configured to reject such requests and if accessing the image from different that there are high chances of that the resulting server might be switched off the hot loading of images.
Resources:
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.