Jump to content
JoHubb

Images

Recommended Posts

It's my first post and I am not far up the HTML learning curve. Thanks for having me on these boards.

Quote

 

However, it is common to store images in a sub-folder. You must then include the folder name in the src attribute:

Example

<img src="/images/html5.gif" alt="HTML5 Icon" style="width:128px;height:128px;">

 

 
I run Linux Kubuntu and I don't follow this. How does the program know where to look for the sub-folder? There is no path...?? 
In any case there is no /images sub-folder in my set up. Do I need to create one somewhere? If so, where? 

Share this post


Link to post
Share on other sites

IF using a server, the root folder where all your html is placed, is 'localhost' using '/' means it will target the root folder then transverse paths given to file location and yes! any path folder included means that folder must exist to retrieve that file.

https://www.w3schools.com/html/html_filepaths.asp

Because you have the potential to have 100s is 1000s or more it would be more manageable to place them in there own folder, and not mix with html, php, js files.

Edited by dsonesuk

Share this post


Link to post
Share on other sites

Thanks.  But you are jumping ahead of me!  I am running a desktop PC with Linux. It is not a server. I do not have a website. I am using the 'Try it Yourself' pages.

When I try to open my own picture in a 'Try it Yourself' page, it cannot find it.  Maybe I am jumping ahead of myself.

Edited by JoHubb

Share this post


Link to post
Share on other sites

That why I said

Quote

IF using a server

Using O/S filesystem won't work completely the same way, may require file:// instead of http:// to  locate a file, and full absolute path instead of relative to current page.

IF you tried to open a image file on your Linux O/S from the 'try it page' from ww3schools tutorial page, that won't work either, the need to copy the code from tutorial save as .html with "UTF-8" encoding, then attempt to get it to work path mentioned above.

Edited by dsonesuk

Share this post


Link to post
Share on other sites

(1) As far as I can make out, that screenshot contradicts location path for image and html file, from one image to the next?

Get the image to show using file:/// as you did in accessing html file in bowser address bar. Also with windows you can right click->open with-> then select browser, this will open the image in browser, not a a html web page, use the Linux alternative to get the same result. You can get the url required to use in image src attribute.

  • Like 1

Share this post


Link to post
Share on other sites

Ok, I will try that.  I'm travelling tomorrow and on Sat, so can't do much till Sunday or Monday. 

I plan to post again then. 

 

Share this post


Link to post
Share on other sites
On 9/19/2018 at 11:09 PM, dsonesuk said:

Get the image to show using file:/// as you did in accessing html file in bowser address bar. Also with windows you can right click->open with-> then select browser, this will open the image in browser, not a a html web page, use the Linux alternative to get the same result. You can get the url required to use in image src attribute.

This did the trick!  This way of doing things would seem pretty fool-proof, using as it does the exact path to the file. 

 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title of the document</title>
</head>

<body>
<h2>Four Foolish Maidens</h2>

<p> These four were absolutely stupid. They forgot to bring oil for their lamps.</p>
<img src="file:///home/howard/Pictures/Congo.jpg" alt="Congo" width="826" height="516">

</body>

</html>

Many thanks! 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×