Why isn't my nav bar not taking me to the specific part of the website

I'am going to assume that all of your files that you're using are finishing with .html and each html file is in the same folder at same level sitting next to each other (to maintain the relative path.

So here's how you should do it.

<header>
   <a href="#" class="logo">Portfo<span>lio</span></a>
   <div class="bx bx-menu" id="menu-icon"></div>

   <ul class="navbar">
      <li><a href="/home.html">Home</a></li>
      <li><a href="/about.html">About</a></li>``
      <li><a href="/coursework.html">Coursework</a></li>
      <li><a href="/resume.html">Resume</a></li>
      <li><a href="/contact.html">Contact</a></li>
   </ul>
</header>

I suppose you create a different file for all your webpages in .html For example your home page should name index.html then your should put a link like this:

<li><a href="index.html">Home</a></li>

Other pages like about you should create a new file about.html then yor link it has look like this example:

<li><a href="about.html">About</a></li>

all the files you created should be in the same folder with index.html wich is the main file of your website, otherwise you need to specific exactly the path to this files.