I try to view an htm page locally (on my laptop) in IE 10 and none of the images appear. However, if I go to the image url itself, it shows fine. For example, if I go to the URL "C:\Users\Angie\Desktop\pdb\ROTE - Main Menu.htm", images like this:
<IMG SRC="graphics/LogoSm2.gif" STYLE="Margin-top: 0pt; margin-bottom: 0pt" width="71" height="67">
do not show, but if I go directly to the image, "C:\Users\Angie\Desktop\pdb\graphics\LogoSm2.gif", it shows.
Can anyone help please?
Edit: RESOLVED. FIGURED IT OUT! It was a stupid oversight on my part. The file had a .htm extension from where I copied it, but I had to change it to .html to view locally. :-P It works with the original relative links. Thanks everyone who tried to help.
You're using a relative path, which means the server checks from the directory it is in. You could traverse all the way to the file, but that's not really recommended. Add the image into your web-app/images directory and grab it that way.
This site may help regarding some resource resolution, although it's a little unclear from your question which server/language you're using.
Try changing it to
src="/graphics/LogoSm2.gif"
Related
I have an image on my computer that I'm trying to add to my HTML by using
img src="myheadshot.jpeg" (arrows included in VS Code), but nothing shows up. I've been able to add images from Google using the image address, but I can't seem to find a solution to the local image issue.
I'm just beginning my coding journey, so any help is much appreciated!
Make sure your code and image are saved in the same file or location on your computer. (e.g. The code and image are both saved on the desktop or in a file on the desktop.)
Also, maybe try this:
src="myheadshot.jpg"
Not really a difference, but it works for me!
First of all, I wish you success in this journey that you have just started.
For now, you can paste the image into your IDE and use the extension with the name there.enter code here
Example:
Let the name in the file be bg.jpg.
<img src="bg.jpg" >
When previewing my pages with a live server everything works fine.
but when I tried to open my index file from local it didn't show CSS or anything.
and when click on navigation that links to another page it shown "File not found"
first of all, please provide code with your question. Second of all, I had this once happening to me, I fixed it by changing (this is an example) /CSS/style.css to ./CSS/style.css
So you basically put a dot in front of it. Please let me know if this helps.
I am just getting started using HTML and I seem to have fallen at the first hurdle.
I am trying to create a basic webpage containing an image that is downloaded when clicked.
So far I have:
<a href="/images/selfie_img.jpg" download>
<img src="/images/selfie_img.jpg" alt="Selfie" style="width: 300px">
</a>
I expected this to display the image I want as it seems to my eye to be formatted exactly like all the examples I have seen. However, this only displays the alternative title, not the actual image.
I have checked the image path, and used different images to try and solve the problem. I am using VS code and the software can follow the image path to find the appropriate image, but when I load the program, the image is replaced by that annoying blue question mark. Using a URL as the image path seems to work but then the image isn't downloaded when clicked, I just get the URL.
Welcome to StackOverflow, SpicedWater!
The problem you're describing is most likely caused by a wrong path. Your browser resolves the images path and can't find it. I suggest you take a look at the source code in your browser or the developer console's network tab to see what path it's trying to find this image at and which http status code the browser determined.
I am working on Jet and now have to insert a image in the page. It should be very easy but now I am just not able to make this image shown in the page.
To ensure that there is no path error, I put the image and the html file in the same folder: src/js/views.
Below is the html code snippet:
<img src="xxx.png" style="width:89.25pt;height:18.75pt;" alt="xxx logo">
But the page just shows a broken icon but not this image.
Could you please help me out? Thanks in advance!
Two possible solutions:
Go to your browser's Dev Tools -> Network, and search for your image's request to server (If you cannot find it reload the page while keeping the Dev Tools open.) Does the URL path to the image look correct to you? If not, correct it.
If it still isn't working try using <image> tag instead. This worked for me.
I'm creating a web site and the site consists of a few images. Locally, everything displays correctly, but when I upload it to my server, some of the images are not displayed. None of the GIFs / Animated GIFs are displayed at all and some of the jpeg images are not displayed (while others are OK). The only images which don't appear to be effected are PNG, which display OK.
If I check FireBug and hover over the image link, I receive the message Failed to load given URL.
If I enter a direct URL link to the image on the server, the image is downloaded so it's definitely there.
Here's my CSS:
body {
background-color: #000;
background-repeat:no-repeat;
background-position:top;
background-image:url(../images/background2.gif);
}
I created another web site using the same code, but with a different background.gif image and everything displays correctly, so I'm not sure what else is different?
Also, I have tried deleting the images from the server and re-adding them, but still no luck.
Try putting in the full path in the url:
e.g. background-image:url(http://www.your-site.com/images/background2.gif)
-if that works, then check your paths and make sure the css url matches your directory structure.
Instead of using:
background-image:url("../images/background2.gif");
Use:
background-image:url("/images/background2.gif");
Starting with "/" moves to the root directory and starts there
Starting with "../" moves one directory back and starts there
(also it's a good practice to always include quotes on paths)
Thanks for everyone's help, its turns out that this was a problem with some sort of bandwidth restriction on my work internet. If I viewed the site from anywhere else the images were all loaded..... I really though I was going mad for a while! Thanks again.