How can I link to html pages if they are in same or different folders without writing full path?
How can I link to html pages if they are in same or different folders without writing full path?
Within the same folder, just use the file name:
<a href="thefile.html">my link</a>
Within the parent folder's directory:
<a href="../thefile.html">my link</a>
Within a sub-directory:
<a href="subdir/thefile.html">my link</a>
Also, this will go up a directory and then back down to another subfolder.
<a href = "../subfolder/page.html">link</a>
To go up multiple directories you can do this.
<a href = "../../page.html">link</a>
To go the root, I use this
<a href = "~/page.html">link</a>
In addition, if you want to refer to the root directory, you can use:
/
Which will refer to the root. So, let's say we're in a file that's nested within a few levels of folders and you want to go back to the main index.html:
<a href="/index.html">My Index Page</a>
Robert is spot-on with further relative path explanations.
You can go up a folder in the hierarchy by using
../
So to get to folder /webroot/site/pages/folder2/mypage.htm from /webroot/site/pages/folder1/myotherpage.htm your link would look like this:
<a href="../folder2/mypage.htm">Link to My Page</a>
use the relative path
main page might be: /index.html
secondary page: /otherFolder/otherpage.html
link would be like so:
<a href="/otherFolder/otherpage.html">otherpage</a>
I would caution you: if you are using absolute paths, then your application cannot be installed in a "subdirectory" of the server!
eg, http://yourserver.com/yourapp may work, but http://myserver.com/apps/yourapp will not!
Short answer:
. is for current directory
.. is for upper directory as in cd .. command on shell.
Simple yet tricky, I write this answer primarily for myself not to forget next time.
ademSite/
├── index.html
└── style.css
The link to CSS in index.html:
<link rel="stylesheet" href="style.css"> or
<link rel="stylesheet" href="./style.css">
ademSite/
├── index.html
└── stylefiles
└── style.css
This case it should be:
<link rel="stylesheet" href="stylefiles/style.css"> or <link rel="stylesheet" href="./stylefiles/style.css">
├── html
│ └── index.html
└── stylefiles
└── style.css
In this case path must be:
<link rel="stylesheet" href="../stylefiles/style.css">
href="./page.htm" for the same directory
href="../page.htm" parent directory
href="~/page.htm" root directory or the upper most dir.
When I Was creating a webpage, I found out that With moving Html files to different Folders, It changes the paths of the images, videos, music, PDF files, etc. With them, you have to go out of the file the HTML is located in, with the
../HTML. Then when your out, depending on where your page content is, insert,
<a href="Meme/WP/Chipmunk.html">Chipmunk Memes</a>
*/ This is where the HTML is located ^^^^^^ */
<img class="demo cursor" src="../6.png" width="100" height="50" onclick="currentSlide(6)" alt="Sasha Having Some Fun">
*/ This is where the images are located. The "../6.png" is the image file, and it is located one directory back. */