Can anyone help me because my html page no longer loads images? - html

Can someone help me because when i create the html page, the browser does not load the images.Should I uninstall the chrome browser?

please check your image path URL link. And please share more info about the issue. Code and other docs.

First, we need a folder/file structure.
Please create a Folder named images, you don't need to create a folder for images, but please do it!
Home Folder
images
image.png
index.html
Now, here the basic HTML code:
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<img src="images/image.png" alt="myImage">
</body>
</html>
Please be sure you use the correct file extension, like .png, or .jpg!
Now you can see the image in your browser!
But please send more information, when it doesn't work!
Have a great day.

Related

Why is my HTML file not displaying to the browser?

I am learning how to use a text editor, and I've just created my first file with it. It previews with the correct output, but when I run it in the browser, it gives me a blank page.
As you can see, the doctype and html tags are in place, as well as the head and body. I am using Visual Studio Code as my text editor. Why will this not display anything in my browser? To be clear, it does preview, just won't display in browser
<!DOCTYPE html>
<html>
<head>
<title>Hello World</title>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>
Are you sure? It does display on mine. Is the file saved as a .html file? Also, try opening it on another browser. If that doesn't work, try creating a new file in Notepad or something similar, save it with a .html file extension and try opening it again.
EDIT:
Try using Notepad. Check if the file is saved with a UTF-8 encoding. If that doesn't work, try installing another browser or using Edge/Safari/Internet Explorer or whatever built-in browser you have.
In case someone is still struggling with this, try saving your files before you open them. That fixed the problem for me.
Possible Reasons:
You might not have saved the changes after writing the code (most likely).
Problem with the browser (load it in another browser)
Check the extension (just for clarification)
There is no problem with !DOCTYPE html tag or html tag.
It loaded on Fire Fox, just not on Google Chrome for some reason. I'm sorry for wasting everyone's time. As I have said, I am unfamiliar with VS Code. Thank you for all of your suggestions.
I had this same baffling problem. I quit Chrome, re-opened, and then I was able to open my .html files (from my Mac's Finder) with Chrome just like I could already open them with Safari or other browsers.
I just had this problem and the solution was very simple, so I´ll give it just in case someone runs into the same silly mistake. I was typing all the code in the wrong file.
Add this line of code inside your head element:
<meta charset="UTF-8"/>
I would recommend to put the right path under the src with the correct file location
<script src="scripts/main.js"></script>
I was facing the same issue and none of the steps mentioned helped.
So I deleted the index.html file I had, opened my project folder in VS Code, created a new index.html file there, pasted my code and clicked on go live.
Then I could see my image on the webpage. And after that I could see the image even by double clicking the index.html file from Finder. Hope this helps.
Save your file in Notepad or whatever text generator you are using and then close it before launching the html file in the browser. Mine would not open if Notepad was still open.
In visual studio code just type in a blank page
html:5
then just press the touch "tab", it will display a basic html 5 structure to start
If anyone still needs help- It worked after saving the file on VS Code!
Just remove "<html>" a the second line it's already set in the first line
<!DOCTYPE html>
<head>
<title>Hello World</title>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>

Images not showing on website

So I'm making a website for the first time. I've tried to put some images on it to test via Cyberduck. However, it's not working.
This is my code:
<!DOCTYPE html>
<html>
<head>
<title>Test site</title>
</head>
<body>
<h1>Test</h1>
<p>Test</p>
<img src=“../img/test.png” />
<img src=“../img/tenor.gif”></img>
</body>
</html>
My images are stored in the img folder:
printscreen directory
I've already checked for case-insensiveness.
I've put the images in the img folder and I can access the images via the path. However, I don't see them (in Chrome) or I see that they are broken(in Safari).
Anyone know how to solve this?
This would have been a comment.
Try running a server in the projects directory.
But possible issues might include:
Incorrect file extention.
Incorrect path. Instead of ".../" use "/".
The answer to my question came from keja. Thanks a lot!
I apparently used the wrong quotes. Images are working now, so problem solved!

Embed pdf to website, hide the link and display pdf directly

I want to add a pdf to my blog post. I found the following code on stackoverflow to add the link.
<embed src="https://mypdflink" type=""application/pdf" width="600" height="400">
This code adds a link to the pdf, which is good. But what I really want is to display the pdf on the blog page, without showing the link or asking readers to click to open the pdf. Can anyone please help me?
By the way, this is my first time building my own blog/website. I have no background in website building or computer science in general. I am using free theme on wordpress.com. I appreciate your suggestion and help!
The below worked for me, hope it helps. :)
<html>
<head>
<title></title>
</head>
<body>
<embed src="http://www.dol.wa.gov/forms/420001.pdf" type="application/pdf" width="400" height="600"/>
</body>
</html>
thanks for your help. I ended up not using any html code. The pdf I wanted to insert was a dashboard made in Tableau consisting of a graph and table. What I ended up doing was that I took a screenshot of the pdf, pasted it to painter.net, resized the photo to 300dpi, and inserted the photo to my wordpress post....:)

omouseover not working for images at my machine though it works for online images

This is working in my browser:
<!DOCTYPE html>
<html>
<body>
<img src="http://nineplanets.org/planets.jpg"
onmouseover="this.src='http://nineplanets.org/planetorder.JPG';"
onmouseout="this.src='http://nineplanets.org/planets.jpg';">
</img>
</body>
</html>
But this is not working:
<!DOCTYPE html>
<html>
<body>
<img src="C:\Users\user\Desktop\WE\Pics\milk.png"
onmouseover="this.src='C:\Users\user\Desktop\WE\Pics\butter.png';"
onmouseout="this.src='C:\Users\user\Desktop\WE\Pics\milk.png';">
</img>
</body>
</html>
Please answer as soon as possible and path to my images is totally correct!!
If you want to use paths pointing to your local hard drive, you will need to use the file protocol like this:
file:///c:/Users/user/Desktop/WE/Pics/milk.png
However, it's best practice to use relative URLs instead, for instance:
Pics/milk.png
will find the file milk.png in the Pics folder, where the Pics folder is alongside your HTML file.
You cannot use paths pointing to a local hard drive. That would be a major security issue. you will have to either mount a localhost server or try using the file:// protocol.

Direct downloading link in browser opening file instead of downloading it

I am trying to create a html simple website on IIS that will help downloading files.
<!doctype html>
<html lang="en">
<head>
</head>
<body>
Start automatic download!
</body>
</html>
This is running file. On clicking "Start automatic download!" it is downloading newUpdater.xml in browser. But, If I directly give this download link in browser (below), it is opening the XML file in all browsers(chrome, firefox).
http://169.254.68.202/newUpdater.xml
Any Idea How to fix this. I think this is possible as
http://dl.google.com//googletalk//googletalk-setup.exe
this link on browser will start downloading gtlk directly.