How to load html page into the main page ?

Question

Suppose I have 2 files: Main.html and Home.html, in Main.html page there is html code with the following menu:

<div class="container">
<div id="menu">
<ul class="nav justify-content-center">
<li class="nav-item"><a class="nav-link" href="Home.html">Home</a></li>
<li class="nav-item"><a class="nav-link" href="#">ServiceForum</a></li>
<li class="nav-item"><a class="nav-link" href="#">Question</a></li>
<li class="nav-item"><a class="nav-link" href="#">Forum</a></li>
<li class="nav-item"><a class="nav-link" href="#">Contac</a></li>
</ul>
</div>
</div>

When I click on "Home" from the menu, the Home.html is opened but not in the green area of the Main.html page, so when I click on "Home" from the menu, how do I edit the above code? In addition, when Home loaded by default is also loaded in the green area, how is the above code written? You see the attached photo file: