Why does renaming an image to .html show a wall of code?
Asked by
MellowCedar42
I'm experimenting with a simple website and want to check whether a background image fits correctly. I was told that renaming a .jpg or .png file to .html would let it open in a browser, but when I tried it, the browser displayed a page full of text instead of the image. What's the correct way to preview the image and use it as a website background?
Answers
For a webpage background, leave the image file unchanged and reference it from your CSS. For example: `body { background-image: url("image.jpeg"); background-color: #ccc; }` Make sure the image path is correct relative to the CSS file. You can also add `background-size: cover;` if you want it to fill the page.
Reply to this answer
Don’t change the file extension. Keep the image as .jpg, .jpeg, or .png, then open the original file directly in your browser or enter its full file path in the address bar. Renaming it to .html doesn’t convert the image; it just makes the browser interpret the image data as HTML text.
Reply to this answer
Add your answer
Answers are reviewed before publication.
MellowCedar42: That worked perfectly—thank you! I’m still learning the basics, so I misunderstood what changing the extension actually did.