So IF ‘X’ is your main folder any files in that folder will be accessed like this

<a href="./index.html">Index</a>
<a href="./contact.html">Contact</a>
<a href="./MainContent.html">Main Content</a>

For A, B, and C which are your sub-folders inside X, files can be accessed like this

For Folder A: <a href="./A/index.html">Index</a>

For Folder B: <a href="./B/index.html">Index</a>

For Folder C: <a href="./C/index.html">Index</a>

Linking to Relative Page

Example:

project-folder/
|—— about.html
|—— contact.html
|—— index.html

<a href="./contact.html">Contact</a>

The cleanest way to link between these pages is to use URLs relative to your document root. See Absolute vs relative URLs for more information, but starting each URL with / (making your URLs relative to the document root) will help a lot.

Example: let’s treat your Project Money directory as your document root, and let’s say these are being accessed at http://local.website.com/. This means to access your homepage, you just go to http://local.website.com/ or http://local.website.com/index.html and it loads your homepage. Additionally, http://local.website.com/contact.html will load your contact page, and http://local.website.com/youtube.html will be your YouTube page. Now to deal with subdirectories. http://local.website.com/A/article1.html will load the article1.html page within the A directory.

So to link to your article1.html page from anywhere else, use /A/article1.html as the href value, and similarly to link to your homepage from anywhere else, you can use /index.html. Using the URLs relative to the document root makes linking between pages a lot cleaner than relative to the current path (./A/article1.html, ./article1.html, article1.html, ../index.html, etc). See https://stackoverflow.com/a/21828923/1499877 for additional examples, which also links to additional resources.

I have different pages for my website and I have put those HTML files in a folder X and inside there are index.html, main.html, etc and there are more different pages for different articles. Now that I have separated those articles in different folders A, B, C for easy access inside folder X but now my index.html, main.html etc files are not linking to the article pages. And not even article files are linking to each other.

Look at image for a better understanding of my problem.

        <a class="active" href="Index.html" target="_blank">Home</a>
        <a href="#" target="_blank">Anime Stuff</a>
        <a href="Youtube.html" target="_blank">YouTube</a>
        <a href="Contact Me.html" target="_blank">Know Me</a>